내가 JQuery와 뉴비 해요

Question

함께 일을하고 나는이 두 개의 스크립트에 서로 "대화"얻을 수 있는지 궁금 해서요 :

<form action="" method="post"> 
<fieldset> 
<div id="selextender"></div> 
<p><a href="#" id="seladd">Add</a></p> 
</fieldset> 
</form>  

$(function() { 
    $('a#seladd').click(function() { 
     $('<p><select name="items[]"><option value="1">One</option><option value="2">Two</option><option value="3">Three</option></select><a href="#" class="remove">Remove</a></p>').fadeIn("slow").appendTo('#selextender'); 
     return false; 
    }); 
    $('.remove').live('click', function() { 
     $(this).parent().fadeOut(300, function() { 
      $(this).empty(); 
      return false; 
     }); 
    }); 
}); 

예 : http://jsfiddle.net/UV6Tw/

위의 중복 내 선택 상자 - 동적으로 선택 상자 옵션을 추가하고 여전히 선택 상자를 복제하려면 다음을 통합하려면 어떻게합니까? 이를 사용하여 데이터를로드에 초점이 맞춰지면

이

<form action="#" method="post"> 
<div id="selextender"></div> 
<p><a href="#" id="seladd">Add</a></p> 
</form> 

당신은 새로운 선택을 추가 할 수 있으며 : 어떤 도움을 크게 감상 할 수

$(document).ready(function() { 
    $('select[name="products"]').focus(function() { 
     if ($('option', this).length < 2) { 
      $.getJSON('products.php?product=' + $(this).attr('value'), outputProducts); 
     } 
    }) 
}); 

function outputProducts(response) { 
    $('select[name="products"]').html(response.html).attr('selectedIndex', response.index); 
    return true; 
} 

<form action="#" method="post"> 
<select name="products"> 
<option selected="selected">Please select</option> 
</select> 
</form> 

, 감사

Answer 1

은 다음과 같습니다 일부 HTML을 감안할 때 아약스 : 여기 살아있는 예를 조롱 한

//set a counter 
var i = $('input').size() + 1; 

//add select 
$('a#seladd').click(function() { 
    $('<p><select name="product"><option value="0">Please select</option></select><a href="#" class="remove">Remove</a></p>').fadeIn("slow").appendTo('#selextender');   
    return false; 
}); 

//fadeout selected item and remove 
$('.remove').live('click', function() { 
    $(this).parent().fadeOut(300, function(){ 
     $(this).empty(); 
     return false; 
    }); 
}); 

// dynamically load options when focused. 
$('select[name="product"]').live('focus',function(){ 
    var $this = $(this); 
    $this.children(':first').text('please wait.... loading.'); 
    $.ajax({ 
     type: 'GET', 
     url: 'products.php?product=' + $this.attr('value'), 
     success: function(data){ 
      $this.html(data); 
     }     
    }); 
}); 

이 : http://jsfiddle.net/SJP8h/는 (단,이주의 jsfiddle의 조롱 된 아약스 전화를 사용합니다.)