查找previoius元素与某个类

Question

我有一个jQuery对话框，允许用户添加和删除选项（使用jQuery来更新DOM）。每次选项被添加，输入和一个按钮（“删除”）添加到对话框中的格式如下 -

<div id="existing-options"> 
    <div class="dialog-option"> 
     <div class="dialog-right"> 
      <div class="remove_option button-secondary" id="remove_new_0">Delete</div> 
     </div> 
     <div class="dialog-left"> 
      <input type="text" value="1" class="option text ui-widget-content ui-corner-all" id="new_0" name="new_0"> 
     </div> 
    </div> 
</div> 

我试图让这个如果用户按下回车时，他们都集中在一个输入上，其相应的'Delete'按钮的click事件被触发。

我已经做了一些研究，.sibling()似乎不合适。 .prev()看起来像我最好的选择，但那是行不通的。有人可以告诉我最好的方法来实现这个工作吗？

$(document).ready(function(){ 

    dialog_options_container = $('#existing-options'); // The container which holds the option inputs/buttons 

    /** Capture the 'enter' key when removing an option */ 
    dialog_options_container.bind('keyup', '.option', function(e){ 
     if(e.keyCode === 13){ 
     $(this).prev('.remove_option').click(); 
     return false; // Ignore the default event 
     } 
    }); 

}); 

Answer 1

试试这个：

t.dialog_options_container = $('#existing-options'); 
t.dialog_options_container.on('keyup', '.option', function(e){ 
    if(e.keyCode === 13) $(this).closest('.dialog-option').find('.remove_option').click(); 
    return false; 
}); 

它使用.closest()来选择.dialog-option然后.find()来搜索.remove_option。

Answer 2

你可以尝试通过id靶向按钮具体为（每一个新的部分假设在你的榜样增量0）：

t.dialog_options_container.bind('keyup', '.option', function(e){ 
    if(e.keyCode === 13){ 
     var button_id = $(this).attr('id'); 
     $('#remove_' + button_id).trigger('click'); 
     return false; // Ignore the default event 
    } 
}); 

- 编辑 -试试这个来得到正确的元素...

$('.dialog-left input[type="text"]').bind('keyup', function(e){ 
    if(e.keyCode === 13){ 
     var button_id = $(this).attr('id'); 
     $('#remove_' + button_id).trigger('click'); 
     return false; // Ignore the default event 
    } 
});