Question

我的表格是这样的：

<?php foreach($userID as id):?>

<input type="button" id="ok_<?php echo id?>" value="ok" />
<input type="button" id="cancel_<?php echo id?>" value="cancel" />

<?php endforeach;?>

<script>
$(document).ready(function(){

//how do i set the click events of these buttons, assuming i have 3 sets of the of the ok and cancel buttons.

});
</script>

Answer 1

只需按价值属性选择按钮：

$(document).ready(function(){

    $('[value="ok"]').on('click', function(ev) {
        alert($(this).attr('id'));
    });

});

Answer 2

您可以使用delegate并为每种类型的按钮仅附加1个处理程序。它会处理任意数量的按钮点击事件。试试这个。

$(document).delegate('input[id=^"ok_"]', 'click', function(){
      //Write code here
}).delegate('input[id=^"cancel_"]', 'click', function(){
      //Write code here
});

.delegate()参考：http://api.jquery.com/delegate/

如果您使用的是jQuery ver 1.7+，则可以使用on与委托类似，除了前两个参数互换。

$(document).delegate('click', 'input[id=^"ok_"]', function(){
      //Write code here
}).delegate('click', 'input[id=^"cancel_"]', function(){
      //Write code here
});

注意：在上面的代码中，最好提供一个包含这些元素的容器，而不是指定document来缩小范围。

Answer 3

我相信这就是你所需要的：

<script type="text/javascript">
    $(document).ready(function(){
        $('input[id*=ok_]').bind('click', function(e){
            console.log($(this));
        });
        $('input[id*=cancel_]').bind('click', function(e){
            console.log($(this));
        });
    })
</script>

Answer 4

为什么不为它们设置css类。然后将事件附加到班级。

Answer 5

你能做的最简单的事情就是更好地为你的按钮分配一个类然后给出事件

<?php foreach($userID as id):?>
<input class="event" type="button" id="ok_<?php echo id?>" value="ok" />
<input class="event" type="button" id="cancel_<?php echo id?>" value="cancel" />

<?php endforeach;?>

<script>
$(document).ready(function(){
     $(".event").click(function() {
           // click event code
     });  

});
</script>

如何使用动态ID的可点击jquery设置按钮

5 个答案: