Question

使用此代码动态生成按钮并在其上分配ID：

    function successCBofMissedNamazFromDB(tx, results) {
            if (results != null && results.rows.length > 0 && results.rows != null) {
                var htmlstring = "";
                var temp = 0;
                for (var i = 0; i < results.rows.length; i++) {

                    htmlstring += '<div class="ui-grid-b">';
                    htmlstring += '<div  class="ui-block-a ui-bar-d" style="font-size:x-medium;height:80px;">'
                            + prayerName[i] + '</div>';
                    htmlstring += '<div  class="ui-block-b ui-bar-e" style="font-size:x-medium;height:80px;">'
                            + results.rows.item(i).missing_prayers + '</div>';

                    alert(""+performedNamaz[i]);
        htmlstring += '<div class="ui-block-c ui-bar-e" style="font-size:x-medium;height:80px;"><input type="number" data-inline="true" data-mini="true" value="'+performedNamaz[i]+'"/><a href="#" data-role="button" data-inline="true" data-icon="plus" id=button'+i+' style="float:right;width:30%;">ADD</a>'
        +''+ '</div>';
         htmlstring += '</div>';
    }
$("#chart1").empty().append(htmlstring).trigger('create');
}
}

使用此代码获取其点击事件中每个按钮的ID：

$('button').live('click', function(){
         var btnId = $(this).attr('id');
         alert(btnId);
      });

这一行有什么语法错误，这就是为什么当我尝试静态分配id工作正常时它不起作用的原因

htmlstring += '<div class="ui-block-c ui-bar-e" style="font-size:x-medium;height:80px;"><input type="number" data-inline="true" data-mini="true" value="'+performedNamaz[i]+'"/><a href="#" data-role="button" data-inline="true" data-icon="plus" id=button'+i+' style="float:right;width:30%;">ADD</a>'
            +''+ '</div>';

Answer 1

的问题

value='+performedNamaz[i]+'  and id=button'+i+'

将其更改为

htmlstring += '<div class="ui-block-c ui-bar-e" style="font-size:x-medium;height:80px;"><input type="number" data-inline="true" data-mini="true" value="+performedNamaz[i]+"/><a href="#" data-role="button" data-inline="true" data-icon="plus" id=button"+i+" style="float:right;width:30%;">ADD</a>'

不推荐使用

和Live（）使用button click的on（）函数。

Answer 2

我认为delegates在您的示例中效果会更好，而不是live()。

$('.ui-block-c').delegate('a#button','click', function(){
    var btnId = $(this).attr('id');
    alert(btnId);
});

作为附注：对于HTML规范，要有多个具有相同ID的元素，因此我建议您将其替换为类

Answer 3

正如你所说，代码在静态值下运行正常，我假设问题接近于id。试着把＃34;靠近id。

id="button'+i+'"

完整代码

htmlstring += '<div class="ui-block-c ui-bar-e" style="font-size:x-medium;height:80px;"><input type="number" data-inline="true" data-mini="true" value="'+performedNamaz[i]+'"/><a href="#" data-role="button" data-inline="true" data-icon="plus" id="button'+i+'" style="float:right;width:30%;">ADD</a>'
            +''+ '</div>';

如何动态设置按钮ID并绑定点击事件？

3 个答案: