javascript - 他の HTML 要素内にネストされた HTML 要素の値を取得するには?

Question

以下に示すようなHTML要素があります

<div id="container">
    <div>
        <span>
            <input type="text" id="item1" value="AA"/>
        </span>
    </div>
    <div>
        <span>
            <input type="text" id="item2" value="BB"/>
        </span>
    </div>
    <div>
        <span>
            <input type="text" id="item3" value="CC"/>
        </span>
    </div>
</div>

JavaScript と Jquery を使用して -from item1,item2,item3 の[AA,BB,CC]ような値と IDの配列を抽出する必要があります。どうすれば同じですか?[1,2,3]

score 0 · Accepted Answer

試す

var idarray = [];
var valuearray = [];

$("#container input").each(function(){
   var $this = $(this);
   idarray.push($this.attr("id").substring(4));
   valuearray.push($this.val());
});

console.log(idarray);
console.log(valuearray);

デモ:フィドル

score 0 · Accepted Answer

var arrId = [], arrVal = [];
$("input[type='text']").each(function(){//find input text
  if(this.id && this.id.indexOf("item")===0){//check id starts with item
    arrId.push(this.id.replace("item",""));//push id
    arrVal.push(this.value);//push value
  }
});

http://jsfiddle.net/jGNy7/

score 0 · Accepted Answer

これを試して：

var vals = [];
var ids = [];
$("#container input").each(function(){
    vals.push($(this).val());
    ids.push($(this).attr("id").replace("item", ""));
});

ここにjsfiddleがあります：

score 0 · Accepted Answer

これを試して：

$(document).ready(function() {
    var valuesArray = []
        , idsArray = [];
    $('#container').children().each(function() {
        valuesArray.push($(this).children().children().val());
        idsArray.push($(this).children().children().prop('id').substr(4));
    });
    alert(valuesArray);
    alert(idsArray);
});

score 0 · Accepted Answer

var ids = $("input[id^='item']").map(function(i,e){
    return e.id;
});

var values = $("input[id^='item']").map(function(i,e){
    return $(e).val();
});

console.log(ids);
console.log(values);

作業例: http://jsfiddle.net/RLsCX /

score 0 · Accepted Answer

http://jsfiddle.net/2dJAN/8/を参照してください

var ids = []
var values = []
$('#container input[type=text]').each(function() {
ids.push($(this).attr('id'));
values.push($(this).val())
})
alert(ids)
alert(values)

score 0 · Accepted Answer

入力をループし、値を取得し、アイテムの値を解析します。このようなもの：

var ids = [];
var values = [];

$("input").each(function(){
   var input = $(this);
   var value = input.val();
   var id = input.attr("id").replace("item", "");

   ids.push(id);
   values.push(value);
});

これが実際の例です(警告: 2 つの警告ポップアップが表示されます)

入力値がを使用して取得されていることに注意してくださいinput.val()。これにより、取得された値がユーザーが入力した現在の値であることが保証されます。属性が必要な場合value（ユーザーが何か他のものを入力するだけでは変更されません）、input.attr("value")代わりに使用できます

inputページに含めたくない他の要素がある場合は、セレクターをより具体的にする必要があります。たとえば、必要なすべてのinput要素が要素に含まれているid="container"場合は、代わりにこれを使用できます。

$("#container input").each(...

javascript - 他の HTML 要素内にネストされた HTML 要素の値を取得するには?

8 に答える 8

Related

Reference