當按下鏈接時，我有一個帶有鏈接的頁面我想使用jQuery將新的LI添加到UL，我創建了我的jQuery函數，它只工作一次，我的意思是，jQuery的功能，適用於只是點擊使用jquery將ul添加到ul只是一次

jQuery的

$("#addRelation").ready(function(){ 
    $("#addRelation a").css("padding","6px"); 
    $("#addRelation .araNew").bind('click',function(){ 
     $("#addRelation .araNew").hide(); 
     $("#addRelation ul li:last").append('<li> \n\ 
<p>\n\ 
     <label>Source</label>\n\ 
     <select name="source[]" id="source">\n\ 
      <option>select source</option>\n\ 
     </select>\n\ 
</p>\n\ 
<p>\n\ 
     <label>Destination</label>\n\ 
     <select name="destination[]" id="destination">\n\ 
       <option>select destination</option>\n\ 
     </select>\n\ 
</p>\n\ 
<p>\n\ 
     <a href="#" class="araNew">new</a> \n\ 
     <a href="#" class="araDel">delete</a> \n\ 
</p>\n\ 
</li>'); 
    });

HTML

<div class="container" id="addRelation"> 
    <ul class="containerUL"> 
     <li class="containerLI"> 
      <label>Name</label> 
      <input type="text" name="relationName" class="longInput1"/> 
      <div id="arSuggestions"></div> 
     </li> 
     <li> 
      <label>Related Concepts</label> 
      <p> 
       <label>Source</label> 
       <select name="source[]" id="source"> 
        <option>select source</option> 
       </select> 
      </p> 
      <p> 
       <label>Destination</label> 
       <select name="destination[]" id="destination"> 
        <option>select destination</option> 
       </select> 
      </p> 
      <p> 
       <a href="#" class="araNew">new</a> 
       <a href="" class="araDel">delete</a> 
      </p> 
     </li> 
    </ul> 
</div>

，並添加李書福UL從我的功能不同有什麼建議？

來源

2012-05-15 William Kinaan

內$.on語法添加您的追加這樣的代碼

$("#addRelation").on('click','.araNew',function(){ 
// add li code 

});

檢查工作fiddle here

來源

2012-05-15 16:06:25

我沒有和仍然錯誤 –

是它的工作原理，很抱歉，我就接受你的答案 –

這裏的工作小提琴http://jsfiddle.net/joycse06/4pVPx/ –

這是因爲您在以後動態插入元素。使用.on來附加click事件處理程序，這將確保爲動態插入的元素調用事件處理程序。

$("#addRelation").on('click', '.araNew', function(){ 
    // code here   
});

來源

2012-05-15 16:05:46

是你的權利，它的工作原理謝謝 –

的問題是，您要添加新的元素a到DOM，但該事件處理程序綁定到老。您可以使用事件代表團（與jQuery的on方法，或者delegate如果你使用低於1.7的版本）來捕獲點擊事件越往上DOM樹：

$("#addRelation").on("click", ".araNew", function() { 
    //Do stuff... 
});

這將當它捕獲點擊事件到達祖先div元素。它將檢查事件目標是否匹配.araNew，如果它確實會執行事件處理程序。這樣，無論您點擊哪個元素匹配.araNew，處理程序都會執行。

或者，您可以簡單地將「新」和「刪除」鏈接移動到ul以外，而不是每次都創建新鏈接。

來源

2012-05-15 16:05:56

是謝謝你它的工作原理 –

，我愛你的替代解決方案，謝謝 –

你躲在老araNew並添加一個新的，而不點擊綁定到它。

來源

2012-05-15 16:07:49

，但在我的jquery上，我沒有在標記A –

類上的事件是的，但它綁定到類*在*時你發出'bind（）'。之後創建的任何內容都不受限制。 –

是的，我不得不這樣做。 BLIND，謝謝 –

使用jquery將ul添加到ul只是一次

jQuery的

HTML

回答

相關問題