web-dev-qa-db-ja.com

removeData（）jqueryメソッドが機能しない

私はremoveDataを正しく使用していると思いますが、動作していないようです。開発コンソールに表示されているのは次のとおりです。誰かが私が間違っていることを説明できますか？

現在のデータ属性値を出力し、removeDataを呼び出してから、値を再度出力します。

$('.questionList > li').eq(1).data('fieldlength')
3
$('.questionList > li').eq(1).removeData('fieldlength');
[
<li class=​"questionBox" data-createproblem=​"false" data-fieldlength=​"3" data-picklistvalues data-required=​"true" data-sfid=​"a04d000000ZBaM3AAL" data-type=​"Text">​
<div class=​"questionLabel">​Birthdate​</div>​
</li>​
]
$('.questionList > li').eq(1).data('fieldlength')
3
jquerycustom-data-attribute
25
turbo2oh

これは、あなたのdataがHTMLに由来するためですdata-fieldlength属性。 the docs によると：

.removeData（ "name"）を使用する場合、内部データキャッシュにその名前のプロパティがない場合、jQueryは要素のdata-属性を見つけようとします。 data-属性の再クエリを回避するには、.removeData（）を使用するのではなく、名前をnullまたは未定義の値（たとえば、.data（ "name"、undefined））に設定します。

だから代わりに

$('.questionList > li').eq(1).removeData('fieldlength');

やったほうがいい

$('.questionList > li').eq(1).data('fieldlength',null);
29
Blazemonger

他の誰かがそれにつまずいた場合に備えて、明確にしたかったちょっとした落とし穴があります...

要素にHTML5の_data-*_属性がある場合、DOM内の要素から削除するには、removeAttr()ではなくjQueryのremoveData()を使用する必要があります。

たとえば、実際に使用する必要がある要素からデータ属性を削除するには：

_$({selector}).removeAttr('data-fieldlength');
_

readのような値は$({selector}).data('fieldlength')でこのようにできますが、removeData()は、ページのソースに存在する要素のHTML属性である場合、実際には削除しません（それをメモリから削除するだけなので、jQueryで再度クエリを実行すると、削除されます表示される）。

個人的にはこの振る舞いは壊れていると思いますし、きっと多くの人を魅了していると思います。

40
Iain Collins

実際、これは私にとってはうまくいきます。要素の属性はそのままですが、値が割り当てられていないためです。

$(selector).attr("data-fieldlength","");
2
Gardoku

カスタムデータ属性を使用してオブジェクトデータを格納する非表示フィールドで、IDを使用して.removeData（）ではなく.removeAttr（）を使用する必要があります

2
Sandesh Chavan

.removeData()はjQueryの内部.data() cacheからのみデータを削除するため、要素の対応する_data-_属性は削除されません。したがって、後でdata()を呼び出すと、要素の_data-_属性から値が再取得されます。これを防ぐには、 .removeAttr() とともに .removeData() を使用して_data-_属性も削除します。

例：

_$('div').removeData('info');
$('div').removeAttr('data-info');
_

次に、次のいずれかを設定します。

_$('div').data('info', 222);
$('div').attr('data-info', 222);
_
1
ztrat4dkyle