使用jquery选择器通配符获取按钮单击

时间:2013-06-06 20:30:43

标签: jquery binding wildcard

我发布一个PHP文件的帖子,获取一个对象数组,然后遍历它们并在DOM中附加键值对。对于每一行数据,我附加一个“更新”按钮,我使用计数器变量给出一个唯一的ID。这一切都很好。我有一个函数,我委托动态插入到文档中的按钮的单击,我想将此单击事件绑定到以短语开头的任何按钮。我一直在控制台中收到错误:

语法错误,无法识别的表达式:$(“[id ^ = updateiprange]”)

我觉得这可能与所有嵌入式引号有关,但我已经尝试了各种各样的方法......

以下是创建DOM输出和按钮的循环代码:

$.post(
                    url,
                    {
                     loc_name: locname
                     },
                    function (data) {
                        $("#iprangetable").html("<tr><td></td><td></td><td><p>System ID</p></td><td><p>Loction ID</p></td><td><p>IP Range</p></td><td><p>Subnet</p></td><td><p>VLAN</p></td><td><p>Description</p></td></tr>");
                        $.each(data, function (){
                            ++counter;  //global defined earlier
                            $("#iprangetable").append('<tr>');
                            $("#iprangetable").append('<td><button id="updateiprange'+ counter + ' ">Update</button></td><td><button id="deleteiprange' + counter + '">Delete</button</td>');
                            $.each(this, function (k,v) {
                            if (k == "id") {
                                $("#iprangetable").append('<td><input type="text" id="ipid' + counter + '" value="' + v + '" style="background-color:#ff9900" disabled = "disabled"></td>');
                                }
                            else if (k == "loc_id") {
                                $("#iprangetable").append('<td><input type="text" id="iplocid' + counter + '" value="' + v + '" style="background-color:#ff9900" disabled = "disabled"></td>');
                                 }
                            else if (k == "VLAN") 
                                {
                               $("#iprangetable").append('<td><input type="text" id="vlaninput' + counter + '" value="' + v + '"></td>');
                                }
                            else if (k == "iprange") 
                                {
                                $("#iprangetable").append('<td><input type="text" id="iprangeinput' + counter + '" value="' + v + ' "></td>');
                                }
                                else if (k == "subnetmask") 
                                {
                                $("#iprangetable").append('<td><input type="text" id="subnetinput' + counter + '" value="' + v + '"></td>');
                                }
                                else if (k == "description") 
                                {
                                $("#iprangetable").append('<td><textarea id="ipdescription' + counter + '" rows="5" cols="50">' + v + '</textarea></td>');
                                }
                        });
                            $("#iprangetable").append('</tr>');

                         }); 

这是按钮的绑定:

 $(document).on('click', '$("[id^=updateiprange]")', function () {


         }); 

1 个答案:

答案 0 :(得分:2)

您的绑定声明不正确。为此更改

$(document).on('click', 'button[id^="updateiprange"]', function () {...}