这是一个错误吗？请检查一下

Question

的HTML

<div contentEditable="true">testing....</div>

的jQuery

$(document).ready(function(){
   $('[contenteditable]').removeAttr('contenteditable');
});

以上代码很好并且正常工作。你可以感受到它here。

现在，试试这个

$('[contentEditable]').removeAttr('contentEditable'); 
// notice the CamelCase of the string contentEditable

在FF 3.6中，它在控制台上出现错误

  

无效或非法字符串   指定的“代码：”12
elem [name]   =值;

并且div仍然可以编辑。

我怀疑它是jQuery选择器，但不是。通过进一步检查，这是.removeAttr('contentEditable');传递的论点。它适用于所有小写字母。所以，我认为应该是所有小写字母。我很好奇所以我尝试添加CLass作为属性并执行.removeAttr('CLass');。但它的运作没有错误。

那么，contentEditable怎么会给我这个错误？

---

更新

来自Kobi，似乎它实际上接受了除contentEditable以外的任何情况（我也尝试过）。

CamelCase

Answer 1

这不是关于小写字母，而是关于 确切的大写 。除contentEditable之外的任何其他外壳都有效，例如：removeAttr('ConTentEditable'); 我找不到问题的确切来源，我猜这是Firefox限制。

在删除它之前似乎是jQuery sets the attribute to an empty string，这就是造成错误的原因。这看起来效果更好：

$('[contentEditable]').attr('contentEditable', false);

Answer 2

你可以称之为bug，但实际上框架是这样设计的。 removeAttr以及其他 attr 函数指向jQuery.attr()以设置属性的值。将属性设置为""后，它会尝试将其删除。 attr()的代码首先使用in运算符专门检查给定字符串是否是对象的属性名称：

// If applicable, access the attribute via the DOM 0 way
if ( name in elem && notxml && !special ) {

（来自jQuery 1.4，第1452-1453行）

由于您提供了camelCase属性名称，因此它使用的不是elem.setAttribute()，而是name in elem，这是问题的原因。对于任何其他情况，setAttribute()将返回false（因为属性名称区分大小写），这就是它成功的原因。 jQuery主要用于处理{{1}}的跨浏览器问题。

看起来Firefox在将属性设置为空字符串时遇到问题，除非您在其他浏览器中遇到同样的问题。您可以尝试在jQuery站点或MDC上提交错误。

Answer 3

contentEditable接缝是一个特殊属性： http://www.whatwg.org/specs/web-apps/current-work/multipage/editing.html#contenteditable

Answer 4

contentEditable 属性（非属性，因为那不是attr()和朋友通常会处理的内容）需要一个字符串值，一个是“true”，“ false“和”继承“。我不会使用jQuery来关闭contentEditable，但我想以下是可行的：

$('[contenteditable]').attr("contentEditable", "false");

或者您可以绕过jQuery来设置实际的contentEditable属性：

$('[contenteditable]').each(function() {
    this.contentEditable = "false";
});