0

以下のような入力があります。

<input type="hidden" id="selected_id-1" name="e_id[]" />
<input type="hidden" id="selected_id-2" name="e_id[]" />
<input type="hidden" id="selected_id-3" name="e_id[]" />
<input type="hidden" id="selected_id-4" name="e_id[]" />

また、その入力を削除する各入力のボタンもあります。

しかし、たとえば"selected_id-2"入力を削除すると、次の入力のIDを更新したいと思います。したがって、"selected_id-3"は"selected_id-2"、および"selected_id-4"-になり"selected_id-3"ます。

これらの ID を更新するにはどうすればよいですか? 純粋な JavaScript が必要で、フレームワークは必要ありません。

4

6 に答える 6

1

このようなものが欲しいですか？

var els = document.getElementsByTagName('input');
for (var i=0; i<els.length; i++) {
    els[i].id = 'selected_id-'+i;
}

jQueryがなくても（ただし、それほど古いブラウザではありません）、より正確なものが必要な場合は、次のようにすることができます：

var els = document.querySelectorAll('input[name="e_id[]"]');
于 2012-09-07T10:52:47.930 に答える
1

すべての<input>要素を配列に取得できます。その配列を繰り返し処理し、必要な数に達したら、 に置き換え'select_id-'+(i)ます'select_id-'+(i-1)。

<input>すべての要素の配列を取得する方法は次のとおりです。

var myControls = document.getElementsByTagName('input');

そして、for (概念コード) を実行します。

for (var i = 1; i < [length of myControls]; i++) { 
    if (this_id's_number < i) {
        continue;
    } else if (this_id's_number == i) {
        remove this input
    } else {
        current_number = getCurrentNumberFromID();

        current input's id = current_number -1;
    }
}
于 2012-09-07T10:54:05.260 に答える
1

マークアップによっては、すべての入力を取得するためのより良い方法がおそらくあります。たとえば、特定のコンテナー内ですべてを検索するなどですが、そのような情報が不足している場合でも、次のようなことができます。

function updateIds() {

   var count = 0;

   var inputs = document.getElementsByTagName('input');
   for(var i = 0; l = inputs.length; i < l; i++) {
      if(inputs[i].name == 'e_id[]') {

         inputs[i].id = 'selected_id-' + (++count);

      }
   }

}
于 2012-09-07T10:54:55.897 に答える
0

と呼ばれる JavaScript のメソッドを使用できますsetAttribute()。

JavaScript の方法:

var elem = document.getElementById("selected_id-2"); 
elem.setAttribute("id", "selected_id-3");
elem.id = "selected_id-3";

jQuery の方法:

$("#selected_id-2").attr("id", "selected_id-3");
于 2012-09-07T10:53:33.810 に答える
-1

次のようなDOM体操を使用できます

document.getElementById("elementId").id.value="newId"
于 2012-09-07T10:52:09.677 に答える
-1 
$("#selected_id-" + number_to_change).attr('id',"selected_id-"+(number_to_change-1));
于 2012-09-07T10:53:34.587 に答える