2010-07-07 3 views
7

html

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

jQuery

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

ci-dessus codes est très bien et le travail. vous pouvez le sentir here.est-ce un bug? s'il vous plaît vérifier

Maintenant, essayez ce

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

en FF 3.6, il donne une erreur sur la console

Une chaîne non valide ou illégale a été spécifié "code:" 12
élém [nom] = valeur;

et la div est toujours modifiable. Je pensais que c'était le sélecteur jQuery, mais ce n'est pas le cas. Par une inspection plus approfondie, il a été l'argument passé sur le .removeAttr('contentEditable');. Cela fonctionne quand toutes les petites lettres. Donc, je pensais que ce devrait être toutes les petites lettres. Je suis curieux, donc j'ai essayé d'ajouter CLass comme attribut et faire .removeAttr('CLass');. Mais alors cela fonctionne sans erreur. Donc, comment se fait-il que contentEditable me donne cette erreur?


mise à jour

de Kobi, il semble qu'il accepte effectivement tous les cas sauf contentEditable (j'ai essayé aussi).

CamelCase

+0

Est-ce HTML5 doctype ou XHTML ? – airmanx86

Répondre

2

Ce n'est pas sur les petites lettres, mais sur le boîtier exact . Tout autre boîtier que contentEditable fonctionne, par exemple: removeAttr('ConTentEditable');.
Je ne peux pas trouver la source exacte du problème, je suppose que c'est une restriction de Firefox.

Il semble que jQuery sets the attribute to an empty string avant de le supprimer, ce qui est à l'origine de l'erreur. Cela semble fonctionner mieux:

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

Vous pourriez appeler cela un bug, mais vraiment le cadre est conçu de cette façon. removeAttr, ainsi que d'autres fonctions attr, pointe sur jQuery.attr() pour définir la valeur de l'attribut. Après avoir défini l'attribut sur "", il tente ensuite de le supprimer. Le code attr() vérifie spécifiquement pour voir si la chaîne est un nom de propriété sur l'objet en utilisant d'abord l'opérateur in:

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

(de jQuery 1.4, ligne 1452-1453)

Puisque vous êtes En fournissant le nom de la propriété camelCase, il l'utilise au lieu de elem.setAttribute(), ce qui est précisément la cause du problème.Pour tout autre cas, name in elem retournerait false (car les noms de propriétés sont sensibles à la casse), ce qui explique pourquoi il a réussi. jQuery fait cela principalement pour contourner les problèmes de navigateur avec setAttribute().

Il semble que Firefox a un problème avec la définition de la propriété à une chaîne vide, sauf si vous avez le même problème dans d'autres navigateurs. Vous pouvez essayer de déposer un bug sur le site jQuery ou MDC.

+2

+1. En raison des bogues IE traditionnels, les fonctions 'attr' de jQuery essayent de cacher la différence entre un attribut HTML (' contenteditable') et une propriété DOM ('contentEditable'). Avec des résultats confus, comme d'habitude lorsque vous essayez de cacher une différence importante. – bobince

0

Le contentEditablepropriété (pas d'attribut, puisque ce n'est pas ce attr() et les amis traitent habituellement) attend une valeur de chaîne, l'un des « true » , "false" et "inherit". Je ne voudrais pas utiliser jQuery pour désactiver contentEditable, mais j'imagine ce qui suit fonctionnerait:

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

Ou vous pouvez contourner jQuery pour régler la contentEditable réelle propriété:

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