查找动态创建的输入

时间:2014-05-11 23:37:48

标签: javascript dynamic input

我有一个动态创建的文本输入字段。数量取决于用户需要多少......

    <div id="dropdowncreate" >
        <div class="control-group" style="display:inline-block; vertical-align:top; width:250px;">
            <a href="#" class="nav" id="adddropdown" style="width:200px;">CREATE FIELD</a>
            <div id="adddropdownarea" class="controls" style="margin-left:10px; margin-bottom:10px; margin-top:10px;">
            </div>
            <a href="#" class="nav" id="subdrop" style="width:200px;" onclick="addDropDown()">ADD TO FIELD</a>
        </div>
</div>

        <script>
        $("#adddropdown").click(function(){
            var elem = $("<input/>",{
            type: "text",
            name: "dropdown_[]"
        });

        var removeLink = $("<span/>").html(" REMOVE</br>").click(function(){
            $(elem).remove();
            $(this).remove();
        });

        $("#adddropdownarea").append(elem).append(removeLink);
        });


        </script>

当我想选择并循环浏览所有输入以找到名为&#34; dropdown&#34;的输入时,我的脚本只找到在页面加载时创建的那些,但不是这些动态创建的输入.. < / p>

function addDropDown(){
    var elems = document.newlog.elements;
    var len = elems.length;
    var dropdowns = new Array();


        for ( var i = 0; i < len; i++ ) {
            if (elems[i].type === 'text') {
                dropdowns.push(elems[i].name);
            }
        }

    document.getElementById('ajaxfield').innerHTML = dropdowns;
    console.log(dropdowns);

}

如何获取addDropDown()函数来查找动态创建的输入?基本上,我想找到表单中的所有输入,我可以处理它们的排序和过滤 - 但是这个函数甚至看不到输入。


行。因此,从Jquery切换到vanilla似乎无法解决问题...原始脚本(添加字段)到此...

function adddroptext() {
            var dropdowntextinput=document.createElement('input');
            dropdowntextinput.type = "text";
            dropdowntextinput.name = "dropdown";
            document.getElementById('adddropdownarea').appendChild(dropdowntextinput);
        }

成功创建输入,但我仍然只能在页面加载时找到文本输入。


进行了相当多的搜索,但将document.newlog.element更改为var elems = document.getElementsByTagName(&#39; input&#39;);做了伎俩。

1 个答案:

答案 0 :(得分:0)

您可以使用document.getElementsByTagName('input')

中的DOM
$("#findInputTag").click(function(){
    alert("You have " + document.getElementsByTagName('input').length + " input tag");
});

Demo