0

私はjsとjqueryライブラリの初心者です。特定の名前の入力フィールドの配列を取得し、入力を検証したいと思います。各入力フィールドには NS[0]、NS[1] などの名前が付いています。フィールドは JavaScript によって生成されるため、フィールドの総数はコードによって決定する必要があります。

次のようにjqueryで個々のオブジェクトをアドレス指定できることを知っています。

$("input[name=NS\\[0\\]]").val()のために<input type="text" name="NS[0]">

ただし、NS[0] から NS[x] まで、これらすべての類似要素の配列を取得するにはどうすればよいでしょうか。x は、生成されたフィールドの数に基づいて決定する必要があります。同じ css クラスを共有する異なる名前パターンを持つ他のフィールドが既にあるため、クラスを使用することはできません。これらのボックスは特定の div 領域にありますが、同じ領域に他の入力フィールドがあるため、同じ領域のすべての入力ボックスを選択すると、それらも選択されます。

つまり、入力フィールドの配列全体を取得した後、jquery を使用して各入力フィールドの名前をチェックし、個々の名前をチェックするにはどうすればよいでしょうか。

テーブル ID CNTR1 によって決定される領域にさまざまな名前の入力フィールドがあるので、それらを で選択します$('#CNTR1 input')。を使用して個々のフィールドを選択することもできます$("input[name=]")。ただし、私がやりたいことは、 の下$('#CNTR1 input')のすべてを選択してから、それらの名前に対してループを実行し、名前が所定の基準に一致するかどうかを確認することです。どうやってやるの?

HTML コード:

<table class="table" id="cnservers">
<thead>
      <tr>
        <th>Type</th>
        <th>Preference</th> 
        <th>Value</th> 
        <th>Name</th> 
      </tr>
    </thead>
    <tr id="CNTR0"> 
    <td>CNAME</td><td><input type="text" name="CN_PREF[0]" value=""></td><td>
    <input type="text" name="CN_VAL[0]" value=""></td><td>
    <input type="text" name="CN_NAME[0]" value="">  
    <a class="btn btn-danger" onclick="DelField(this.id);" id="CN_D0" >
        <span class="btn-label">Delete  
    </span>
    </a>            
    <a class="btn btn-primary" onclick="addField('cnservers','CN',10);" id="CN_A0" >
        <span class="btn-label">Add     
    </span>     

    </td></tr>      
</table>

[1]: http://i.stack.imgur.com/bm0Jq.jpg
4

3 に答える 3

1

これを試して

HTML

<table id="CNTR1">
  <tr>
   <td>CNAME</td>
   <td><input type="text" name="CN_PREF[1]" id="CN_IN[1]"></td>
   <td><input type="text" name="CN_VAL[1]"></td>
   <td><input type="text" name="CN_NAME[1]"></td>
  </tr>
</table>

JS

$(document).ready(function(){
   $("#CNTR1 input").each(function() { 
      console.log($(this).attr("name"));
      // Match With predetermined criteria      
   });

});

于 2013-07-25T16:59:55.940 に答える
1

私は何かが欠けているに違いない。http://api.jquery.com/attribute-starts-with-selector/を使用できない理由はありますか?

$('#CNTR1').find('input[name^="NS"]')

それにかんする、

ただし、私がやりたいことは、$('#CNTR1 input') の下のすべてを選択し、名前に対してループを実行して、名前が所定の基準に一致するかどうかを確認することです。どうやってやるの?

$("#CNTR1 input").each(function(index, elem) { 
    var $elem = $(elem),
        name = $elem.attr('name');

    var nameMatchesCondition = true; // replace with your condition 
    if (nameMatchesCondition) {
        // do something!
    }   
});

編集1:

まあ、idまだ html 要素の属性です。だからあなたはすることができます$('[id^="CNTR1"]')...id要素の属性の値には含まれていません#. これは css/jquery セレクターの一部にすぎません。属性スタイル セレクターを使用する場合は、必要ありません。これのパフォーマンスについてはコメントできませんが。

理想的には、 で始まる でjs-cntr作成したすべての要素に、2 番目のクラスをアタッチします。さまざまな名前パターン要素が既に 1 つのクラスを持っている場合でも、そのクラスはスタイリング用です。js を介して選択するためだけにカスタム クラスをアタッチすることを止めることはできません。これは受け入れられていることであり、クラス名が で始まる理由は、選択のために js を介して純粋に使用されることを示すためです。idCNTRjs-

于 2013-07-25T19:42:53.453 に答える
0

.filterフィルター関数でjQuery のメソッドを使用します。

filterCritera = /^CN_NAME\[/; // or whatever your criteria is

var inputs = $('#CNTR0 input');

// you could also cache this filter in a variable
inputs.filter(function(index){
    return filterCritera.test(this.name);
}).css('background','red');

jsbin

投稿したマークアップは、質問に記載されているマークアップではありません (含まれていませんNS[0]) が、上記の正規表現で置き換えることができます。

于 2013-07-25T16:54:41.340 に答える