Question

我有一个页面显示来自服务器的数据，我正在动态添加一个按钮。

<ul data-role="listview" class="ui-li-icon" id="feat" >
</ul>

我的JS代码是

$.each(response.mname, function (i, mname) {

    $('#feat').append(
    '<li>'+ '<a>'+
    '<h4>'+'<p id=name>'+ mname.Name +'</p>' +'</h4>'+
    '<input type="button" value="infobutton" background-color="green" id="button" >'+'</input>'+
    '</a>' +'</li>');

    $("#button").click(function(){
       var m=$("#name").text();
       alert(m);
    });   
});

输出显示应该的数据：

nameabc
infobutton
namexyz
infobutton

问题是：我只能点击第一个按钮，我只获得m的值仅用于第一个按钮，但不能用于所有其他按钮。当我点击nameabc下面的infobutton时，我得到了正确的值nameabc。但是当我点击namexyz下面的infobutton时，它没有显示任何值。

Answer 1

你可以试试这个：

$.each(response.mname, function (i, mname) {
    $('#feat').append(
        '<li>' + '<a>' +
        '<h4>' + '<p id=name' + i +'>' + mname.Name + '</p>' + '</h4>' +
        '<input type="button" value="infobutton" background-color="green" id="button' + i +'" >' + '</input>' +
        '</a>' + '</li>');
});
    $("input[id^=button]").click(function () {
        var p = $(this).closest('li').find('p[id^=name]').prop('id').replace(/name/, '');
        alert(p);
    });

无法获取for循环中的所有ID值

1 个答案: