Jquery .prev（）意外结果

Question

我有这些内容可编辑的字段，旁边有一个小铅笔图标，可以为用户提供一些视觉反馈。但是当用户点击铅笔时，其他一些元素会获得我用jquery应用的焦点。期望的结果是jquery应该找到prev元素并将焦点放在那里。

HTML

 //these divs are all over the page..
  <div>
    <span class="editable" contenteditable="true">my title </span>
    <i class="fa fa-pencil"></i>
  </div>

jquery的

//focus the prev .editable match, not any of the other .editables within the dom   

$( ".fa-pencil" ).click(function() {
    $( ".fa-pencil" ).prev( ".editable" ).focus();
});

Answer 1

您需要引用您点击的元素。

$( ".fa-pencil" ).click(function() {
    $(this).prev( ".editable" ).focus();
});

使用$(".fa-pencil").prev( ".editable" ).focus();引用该类的每个元素并找到它的兄弟。

Answer 2

使用此替换内部jquery选择器。

$（本）.prev（＆＃39; .editable＆＃39;）....

通过这种方式，jquery将开始从点击的图标中查找可编辑的范围。现在你正在寻找＆＃34;文档范围＆＃34;