使用jQuery和jQueryui自動完成刪除附加元素

我試圖使用jqueryui自動完成添加元素但我無法刪除附加元素我該怎麼辦？使用jQuery和jQueryui自動完成刪除附加元素

$(function() { 
    var products = [ 
     { "sn":"P00101","label":"Product 1"}, 
     { "sn":"P00102","label":"Product 2"}, 
     { "sn":"P00103","label":"Product 3"}, 
     { "sn":"P00104","label":"Product 4"} 
    ] 

    $("#project").autocomplete({ 
     minLength: 0, 
     source: products, 
     focus: function(event, ui) { 
     $("#project").val(ui.item.label); 
     return false; 
     }, 
     select: function(event, ui) { 
     $("#project").val(ui.item.label); 
     $("#project-id").val(ui.item.sn); 
     $("<li>").html("["+ui.item.sn+"] "+ui.item.label+"<input type=text size=5><a href='#' class='remove'>Remove</a>").appendTo("#result"); 

     return false; 
     } 
    }) 
    .data("ui-autocomplete")._renderItem = function(ul, item) { 
     return $("<li>") 
     .append("<a>[" + item.sn + "] " + item.label + "</a>") 
     .appendTo(ul); 
    }; 

    $(".remove").live("click",function() { 
     $(this).parent("li").remove(); 
    }); 
    });

，在這裏我的HTML源

<input id="project"> 
<input type="hidden" id="project-id"> 

<h3>Result</h3> <ol id="result" class='lists'></ol>

小提琴http://jsfiddle.net/D98z9/

來源

2014-04-01 user3483709

.live從1.7版本棄用，除去1.9版本，你可以使用.on()代替。

除此之外，因爲您的定位符已動態添加，所以在您綁定它之前，點擊事件將無法用於這些元素。在這種情況下，你可以使用event delegation：

$("body").on("click",'.remove',function() { 
    $(this).parent("li").remove(); 
});

Updated Fiddle

來源

2014-04-01 05:36:42 Felix

使用jQuery和jQueryui自動完成刪除附加元素

回答

相關問題