如何从循环中的listitem / unordered列表的输入中获取值

时间:2012-11-15 00:21:55

标签: javascript input listitem

我正在尝试创建一个通用的JS 从输入中获取id和value。 然后,将它们放入JsonObject以传递回服务器。 列表是这样的:

<ul id="myList" data-role="listview" data-inset="true">
    <li> Field One <input id="Field_One" /></li>
    <li> Field Two <input id="Field_Two" /></li>
    <li> Field Three <input id="Field_Three" /></li>
    <li> Field Four <input id="Field_Four" /></li>
</ul>

我可以获取listitem的数据,

function Test(){
    var unorderedList = document.getElementById('myList'); 
    var ListItems = unorderedList.getElementsByTagName('li');  
    var listID

    for (var i = 0; i < ListItems.length; i++) {
        listID = ListItems[i].firstChild.data;
        //alert(listID);
    };  
}

但我无法进一步获取文本ID或值。 (好吧,如果我有id那么我就能获得价值......)。

如何通过循环获取ul / il中的输入id /值?

3 个答案:

答案 0 :(得分:1)

没有人说firstChild将是输入。实际上,它很可能是一个文本节点。

试一试:

function Test() {
    var unorderedList   = document.getElementById('myList'),
        ListItems       = unorderedList.getElementsByTagName('li');  

    for (var input, i = 0; i < ListItems.length; i++) {
        input = ListItems[i].getElementsByTagName('input')[0];
        console.log(input.id, input.value);
    }
}

<强> Code Example

答案 1 :(得分:0)

您可以使用getAttribute来获取ID。所以:

 listID = ListItems[i].firstChild.getAttribute('id');

答案 2 :(得分:0)

您可以直接获取输入。在您的示例中,似乎没有理由首先获得LI:

http://jsfiddle.net/ysL5B/

function Test(){
    var unorderedList = document.getElementById('myList'); 
    var ListItems = unorderedList.getElementsByTagName('input');  

    for (var i = 0; i < ListItems.length; i++) {
        console.log(ListItems[i].id);
        console.log(ListItems[i].value);
    }
}