Question

我有两个按钮如下：

<input id="btn_sendmsg" name="send_message" type="button" value="SEND MESSAGE 1" />
<input id="btn_sendmsg" name="send_message" type="button" value="SEND MESSAGE 2" />

当我点击"SEND MESSAGE 1"按钮时，它会正常工作，但"SEND MESSAGE 2"按钮根本不会触发，问题是什么？

$("#btn_sendmsg").live('click', function(){
    parameters = $('#form1').serialize();
    alert(parameters);
});

感谢。

Answer 1

您有两个具有相同ID的按钮。将id更改为2个不同的名称，或者将其作为同一类的一部分。

不同的ID

<input id="btn_sendmsg1" name="send_message" type="button" value="SEND MESSAGE 1" />
<input id="btn_sendmsg2" name="send_message" type="button" value="SEND MESSAGE 2" />

//Add a click handler for each id
$("#btn_sendmsg1").live('click', function(){
    parameters = $('#form1').serialize();
    alert(parameters);
});

$("#btn_sendmsg2").live('click', function(){
    parameters = $('#form1').serialize();
    alert(parameters);
});

同一课程

<input id="btn_sendmsg1" name="send_message" type="button" class="btn" value="SEND MESSAGE 1" />
<input id="btn_sendmsg2" name="send_message" type="button" class="btn" value="SEND MESSAGE 2" />

//This click handler is attached to the class
$(".btn").live('click', function(){
    parameters = $('#form1').serialize();
    alert(parameters);
});

Answer 2

ID of an element在文档中应该是唯一的，如果要将相同的键与多个元素相关联，请使用类。

如果有多个元素具有相同的ID，则id-selector将始终只返回ID为

的第一个元素

<input class="btn_sendmsg" name="send_message" type="button" value="SEND MESSAGE 1" />
<input class="btn_sendmsg" name="send_message" type="button" value="SEND MESSAGE 2" />

然后

$(".btn_sendmsg").live('click', function(){
    parameters = $('#form1').serialize();
    alert(parameters);
});

Answer 3

<input class="btn_sendMsg name="send_message" type="button" value="SEND MESSAGE 1" />
<input class="btn_sendMsg name="send_message" type="button" value="SEND MESSAGE 2" />

$('input.btn_sendMsg').click(function(){
      //code here         
});

使用$(this)获取被点击的元素。

Answer 4

您不应为差异元素指定相同的ID。而不是，您可以按类分配。

<input class="btn_sendmsg" name="send_message" type="button" value="SEND MESSAGE 1" />
<input class="btn_sendmsg" name="send_message" type="button" value="SEND MESSAGE 2" />

并尝试在jquery中使用循环运算符来为其分配任何事件。

$(".btn_sendmsg").each(function(){
    $(this).live('click',function(){
       parameters = $('#form1').serialize();
       alert(parameters);
    });
});

Jquery第二个按钮无法触发

4 个答案: