javascript - 使用 jQuery 选择特定的 contenteditable div

Question

给定以下用于一种博客文章编辑器的 html:

<div class="entry">  
  <div class="title" contenteditable="true">
    <h2>Title goes here</h2>
  </div>
  <div class="content" contenteditable="true">
    <p>content goes here</p>
  </div>
</div>  

我正在尝试使用 jquery 来选择 .title 和 .content div，以便为每个 div 附加唯一的事件处理程序。

$('[contenteditable]').on(...);

对两者都有效但是

$('[contenteditable] .title').on(...);

或

$('.title').attr('contenteditable', 'true').on(...);

两者都无法选择特定的 contenteditable block 。

Answer 1

您可以在 CSS .title[contenteditable="true"] 中使用属性选择器。

jsFiddle example

.title[contenteditable="true"] {
    background: red;
}

在 jQuery 中:$('.title[contenteditable]').css("background","re​​d")

jsFiddle example