jQuery，新創建的元素上的觸發器更改事件

我有一個按鈕，在單擊時添加另一組表單域添加另一組表單域，在這些表單域中有2個下拉列表，其中第二個下拉列表的內容依賴於所選內容在第一個下拉列表中...jQuery，新創建的元素上的觸發器更改事件

我想要做的是當新的表單字段按鈕被點擊的新項目被添加，然後更改事件觸發下拉，這是創建下拉式變化，而不是所有的下拉式，當前具有相同的名稱。第一個下拉稱爲分類

爲addFormField函數的代碼是：

function addFormField() { 
var id = document.getElementById("field_id").value; 
$("#products").append("<table width='600' cellpadding='5' cellspacing='0' class='Add_Products' id='row" + id + "'><td width='250' class='left'><label>Select Product Category</label></td><td class='right' ><label><select name='" + id + "' id='ProductCategory'><?php foreach($categories as $key=>$category){ echo "<option value=".$key.">".$category."</option>"; } ?></select></label></td></tr><tr><td width='250' class='left'><label>Select Product Template</label></td><td class='right' ><label><select name='data[QuoteItem][" + id + "][product_id]' id='QuoteItem" + id + "product_id' class='Product' title='" + id + "'></select></label></td></tr><tr ><td class='left'>Name</td><td class='right'><label><input name='data[QuoteItem][" + id + "][name]' type='text' id='QuoteItem" + id + "name' size='50' /></label></td></tr><tr ><td class='left'>Price (ex GST)</td><td class='right'><input type='text' name='data[QuoteItem][" + id + "][price]' id='QuoteItem" + id + "price' onchange='totalProductPrice();' class='quote-item-price' value='0' /></td></tr><tr><td class='left'>Description</td><td class='right'><label><textarea name='data[QuoteItem][" + id + "][description]' cols='38' rows='5' id='QuoteItem" + id + "description'></textarea></label></td></tr><tr><td><a href='#' onClick='removeFormField(\"#row" + id + "\"); return false;'>Remove</a></td></tr></table>"); 


$('#row' + id).highlightFade({ 
    speed:1000 
}); 

id = (id - 1) + 2; 
document.getElementById("field_id").value = id;

}

檢測在產品分類下拉變化，並觸發AJAX是下面的代碼：

$("select#ProductCategory").live('change', function(){ 
     var url = base + "/quotes/productList/" + $(this).val() + ""; 
     var id = $(this).attr('name'); 
     $.getJSON(url,{id: $(this).val(), ajax: 'true'}, function(j){ 
      var options = ''; 
     options += '<option value="0">None</option>'; 
      $.each(j, function(key, value){ 
     options += '<option value="' + key + '">' + value + '</option>'; 
      }) 
      $("select#QuoteItem" + id + "product_id").html(options); 
     }) 
     }).trigger('change');

我一直在嘗試所有下午的工作，最近的一個我上班應用返回的ajax值到所有項目。目前使用直播功能的人可以添加新的領域，並能夠使用下拉獨立的每個其他下拉列表，但它只有當該領域是第一次添加，我有困難得到填充

在此先感謝提供任何幫助

來源

2010-03-15 kwhohasamullet

我假設您已將change事件附加到select.Product，並且需要在將潛在值推入後觸發它。嘗試調整您的AJAX回撥如下：

function(j){ 
    var options = ''; 
    options += '<option value="0">None</option>'; 
    $.each(j, function(key, value){ 
    options += '<option value="' + key + '">' + value + '</option>'; 
    } 
    // setup options and trigger change event. 
    $("select#QuoteItem" + id + "product_id").html(options).trigger('change'); 
)

來源

2010-03-15 10:10:56 gnarf

jQuery，新創建的元素上的觸發器更改事件

回答

相關問題