Id似乎没有在同一个ID中降低。 （JQuery的）

Question

我在点击第一个id = addfriends it show（work）时出现问题，但下面的id不起作用。以下代码。

我的错误代码。解决。

$(document).ready(function(){
    $(".addfriends").click(function(){
       var ajax_load = "<img src='http://localhost/anime/asset/img/loading.gif' alt='loading...' />"
       $('#result').html(ajax_load).load('http://localhost/anime/asset/html/add_friends.html #add-content-friends');
    });
    $(document).delegate(".close", 'click', function(){
        $("#add-content-friends").remove();    
    });
});

<div id="result"></div>

loop
    ...
    <tr><td><a id="addfriends" href="#add/<?php echo $comments['idusers']; ?>">Add friends</a></td></tr>
    ...
endloop

$(document).ready(function(){
    $(document).on("#addfriends", 'click', function(){
       var ajax_load = "<img src='...' alt='loading...' />"
       $('#result').html(ajax_load).load('../add_friends.html #add-content-friends');
    });
    $(document).on(".close", 'click', function(){
        $("#add-content-friends").remove();    
    });
});

Answer 1

您目前正在使用on()而不是delegate()。所以你需要在这里更改顺序：

$(document).on("click", '#addfriends', function(){
    var ajax_load = "<img src='...' alt='loading...' />"
    $('#result').html(ajax_load).load('../add_friends.html #add-content-friends');
});

和

$(document).on("click", '.close', function(){
    $("#add-content-friends").remove();    
});

目前，您的订单是：选择器，事件，处理程序。

on（）的正确顺序是：events，selector，handler。

此外，id是唯一的，您需要使用类代替您的锚点。

<a class="addfriends" href="#add/<?php echo $comments['idusers']; ?>">Add friends</a>

Answer 2

.on( events [, selector ] [, data ], handler(eventObject) )

$(document).on("click", '#addfriends', function(){

<小时/> ID必须是唯一的。

阅读Two HTML elements with same id attribute: How bad is it really?

使用类