Select 所有内容可编辑的 div

Question

我正在尝试 select 所有可编辑内容 div 并更改其中一些功能：

$("div[contenteditable='true']").each(function() {
   console.log($(this).id);
   $(this).onblur="onDivBlur(this)" ;
   $(this).onmouseup="saveSelection()" ;
   $(this).onkeyup="saveSelection(this)" ;
   $(this).onfocus="restoreSelection(this)";

});

我做错了什么？ http://jsfiddle.net/mondayguy/oc2ooLto/ 您能否也请给我提供在纯 js 中执行相同操作的示例？谢谢

Answer 1

使用 $(this).attr('id') 而不是 $(this).id

Answer 2

这是你的答案：

   $("div[contenteditable='true']").each(function() {

  alert($(this).attr('id'));
 $(this).onblur="onDivBlur(this)" ;
 $(this).onmouseup="saveSelection()" ;
 $(this).onkeyup="saveSelection(this)" ;
 $(this).onfocus="restoreSelection(this)";

});

Answer 3

尝试做这样的事情 onblur 和 id 等其他属性 handlers/properties 附加到元素 this 但不是 jQuery 元素 $(this):

$("div[contenteditable='true']").each(function() {
   console.log($(this).attr("id"));
   var self = this;
   $(this).blur(function(){
       onDivBlur(self);
   })
   .mouseup(saveSelection)
   .keyup(function(){
       saveSelection(self);
   })
   .focus(function(){
      restoreSelection(self);
   });
});

请注意，我使用 jQuery 的链接将所有处理程序链接在一起，而不是每次都调用 $(this)。不过，您可以根据需要添加 $(this)。

编辑： jsFiddle: http://jsfiddle.net/oc2ooLto/4/

Answer 4

试试这个：

$("div").each(function() {
if($(this).attr("contentEditable") == "true"){
 console.log($(this).attr("id"));
 //REST OF YOUR OTHER CODE
}
});

Answer 5

$(this) 是指 "each" 循环每次迭代中匹配元素的 jQuery 对象。因此，它本身没有 'id' 属性。它是一个 jQuery 对象。试试这个来访问元素的 id 属性：

$(this).attr("id");

Answer 6

使用您的示例，这应该有效：-

$("div[contenteditable='true']").each(function(ind,elem) {
   //$(this).onblur = 
    alert($(elem).attr('id'));
   $(elem).onblur="onDivBlur(elem)" ;
   $(elem).onmouseup="saveSelection()" ;
   $(elem).onkeyup="saveSelection(elem)" ;
   $(elem).onfocus="restoreSelection(elem)";

});

Select 所有内容可编辑的 div

Select all contenteditable divs

javascript

jquery

contenteditable