jQuery-添加的類沒有使用click函數響應

Question

最好，

有人可以幫助我找出具有添加的類的元素如何像開始時具有該類的元素一樣進行操作嗎？ ->（$（文檔）.ready（...）） 我認為該類未添加到click事件中，但不知道如何解決...

<script type="text/javascript">
  $(document).ready(function() {
     ...
      $('span.del').click(function() {
        var id = $(this).parent().attr('id')
        $("#"+id).remove()
        var input_values  = new Array();
        input_values [0]= id;
        load_page("change","taskMenu2.php",input_values,'del')
            })
     ...
  })
</script>

-

<ul>
    <li id="1" ><span class="del"></span> old </li>
    <li id="2" ><span class="del"></span> old </li>
    <li id="3" ><span class="del"></span> old </li>
    <li id="4" > NEED A DEL SPAN </li>
</ul>

現在：我要向ID為4的 li添加類“ del”的跨度。 當我單擊它（跨度）時，它應該像其他函數一樣執行上面的功能。

<script type="text/javascript">
   ...
   $("#4").prepend('<span class="del"></span>'); 
   ...
</script>

（使用jquery 2.1.0分鍾）

希望找到解決方案

親切的問候

Answer 1

您可以在容器元素上嘗試.on()函數。

例如，在這種情況下，如下所示：

$("ul").on("click", ".del", function() { // Your code });

Answer 2

由於您的span已動態創建，因此您需要在此處使用事件委托 ：

$(document).ready(function() {
    $('#4').on('click', 'span.del', function() {
        var id = $(this).parent().attr('id')
        $("#"+id).remove()
        var input_values  = new Array();
        input_values [0]= id;
        load_page("change","taskMenu2.php",input_values,'del')
    });
})

另外，此處還列出了您的列表項id的旁注。 根據HTML 4規范 ：

ID和NAME令牌必須以字母（[A-Za-z]）開頭，后跟任意數量的字母，數字（[0-9]），連字符（“-”），下划線（“ _”） ，冒號（“：”）和句點（“。”）。

HTML 5規范甚至更寬容，只說：

該值在元素的主子樹中的所有ID中必須唯一，並且必須至少包含一個字符。 該值不得包含任何空格字符。

因此，對於有效的HTML標記，您可以將<li id="1" > ， <li id="2" > ....更改為諸如<li id="li1" > ， <li id="li2" >...

Answer 3

.click()事件不會將事件綁定到動態html元素。 您應該使用.on()綁定動態html元素的事件：

$('ul').on('click', 'span.del', function() {
    // YOUR CODE HERE
});