使用jQuery链接的事件侦听器

时间:2012-06-15 13:45:34

标签: javascript jquery jquery-ui

我有这个HTML结构

<div class="buttons">
    <button data-icon="ui-icon-disk" class="save">Save1</button>
    <button data-icon="ui-icon-check" class="ok">OK1</button>
    <button data-icon="ui-icon-trash" class="delete">Delete1</button>
    <button data-icon="ui-icon-close" class="close">Close1</button>
</div>

页面中有很多像这样的块。
一些按钮带有点击处理功能(保存和删除按钮)。

我想要做的是:如果有人点击确定按钮,则相应的 保存按钮点击绑定功能应该会运行。< / p>

我的代码:

$('.save').click(function(){
    alert('save');
});
$('.ok').click(function(){
    $('.save').click();
});

这是错误的,当我点击确定按钮时所有保存按钮会触发...不仅是同一按钮组中的按钮。

Demo说明了我的问题。

3 个答案:

答案 0 :(得分:5)

使用$(this).siblings('.save').click()仅选择单击按钮的兄弟节点,而不是整个文档中的所有匹配按钮。

演示:http://jsfiddle.net/ThiefMaster/nMnm7/2/
文档:http://api.jquery.com/siblings/

答案 1 :(得分:4)

使用siblings

$('.ok').click(function(){
    $(this).siblings('.save').click();
});

DEMO

答案 2 :(得分:1)

http://api.jquery.com/siblings/

$('.ok').click(function(){
   $(this).siblings(".save").click();
});