1

重複の可能性:
HTML 属性名を jQuery で変更するにはどうすればよいですか?

以前に選択した質問に基づいて、利用可能なさまざまな質問を含む、大きくて複雑なフォームがあります。

これを少し整理するために、同じ名前の重複した入力がいくつかあります。これにより、ページのさらに下にある入力が非表示になっている場合でも、表示されている入力が上書きされるという問題が発生します。

これを防ぐために、属性data-nameの代わりにすべての隠し入力を設定しました。name

質問 属性名を変更するにはどうすればよいですか。例えば：

<input data-name="phone" value="" />
<input data-name="email" value="" />

To
<input name="phone" value="" />
<input name="email" value="" />
4

2 に答える 2

2 
$('input[data-name]').each(function(){
    $(this).attr('name', $(this).attr('data-name')); //does the switch
    $(this).removeAttr('data-name'); //clears out the old one if you need to
});
于 2012-10-10T20:33:51.523 に答える
2

上記の HTML マークアップを考えると、次のことをお勧めします。

$('input').each(
    function(i,el){
        var data = $(el).data();
        for (datum in data) {
            if (!el[datum]) {
                el[datum] = data[datum];
                el.removeAttribute('data-' + datum);
            }
        }
    });​

JS フィドルのデモ。

これは、jQuerydata()メソッドを使用して、メソッドによって反復処理されている現在の jQuery オブジェクトにアタッチされたデータ (存在する場合) を持つオブジェクトを作成しますeach()。

事実上、上記の例ではif、現在の要素に同じ名前の属性がまだないことを確認し (そのため、name既に存在する場合は上書きされません)、存在しない場合はその属性を作成します/財産。

既存の属性を明示的に上書きするには:

$('input').each(
    function(i, el) {
        var data = $(el).data();
        for (datum in data) {
            el[datum] = data[datum];
            el.removeAttribute('data-' + datum);
        }
    });​

JS フィドルのデモ。

参考文献:

于 2012-10-10T23:14:55.230 に答える