Question

我有以下代码段，它没有输入类型。我将这些元素存储在innerHTML中。有没有办法使用jQuery来获取输入类型的所有名称（输入类型的attr）？

<div id="selected-column-1" class="span5 well droppedFields ui-sortable ui-droppable" style="float: left; width: 250px; z-index: 7;">
    <div class="draggableField ui-draggable droppedField" style="z-index: 8;" id="CTRL-DIV-1001">
        <div style="z-index: 9;"><span id="LabelU1">FirstName : </span>
        </div>
        <div style="z-index: 10;">
            <input name="FirstName" type="text" id="FirstName">
        </div>
    </div>
    <div class="draggableField ui-draggable droppedField" style="z-index: 11;" id="CTRL-DIV-1002">
        <div style="z-index: 12;"><span id="LabelU2">LastName : </span>
        </div>
        <div style="z-index: 13;">
            <input name="LastName" type="text" id="LastName">
        </div>
    </div>
</div>
<div id="selected-column-2" class="span5 well droppedFields ui-sortable ui-droppable" style="float: left; width: 250px; margin-left: 10px; z-index: 14;">
    <div class="draggableField ui-draggable droppedField" style="z-index: 15;" id="CTRL-DIV-1004">
        <div style="z-index: 16;"><span id="LabelU5">Email : </span>
        </div>
        <div style="z-index: 17;">
            <input name="Email" type="text" id="Email">
        </div>
    </div>
    <div class="draggableField ui-draggable droppedField" style="z-index: 54;" id="CTRL-DIV-1001">
        <div style="z-index: 32;"><span id="LabelU3">Phone : </span>
        </div>
        <div style="z-index: 33;">
            <input name="Phone" type="text" id="Phone">
        </div>
    </div>
</div>

Answer 1

你可以这样做：

$("#selected-column-1 input").each(function() {
    var name = $(this).attr("name");
});

Answer 2

一种解决方案是使用jquery map：

var allNames = $("input").map(function(){
    return $(this).attr("name");
}).get();

＆＃13;

var allNames = $("input").map(function(){
    return $(this).attr("name");
}).get();

console.log(allNames);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="selected-column-1" class="span5 well droppedFields ui-sortable ui-droppable" style="float: left; width: 250px; z-index: 7;">
    <div class="draggableField ui-draggable droppedField" style="z-index: 8;" id="CTRL-DIV-1001">
        <div style="z-index: 9;"><span id="LabelU1">FirstName : </span>
        </div>
        <div style="z-index: 10;">
            <input name="FirstName" type="text" id="FirstName">
        </div>
    </div>
    <div class="draggableField ui-draggable droppedField" style="z-index: 11;" id="CTRL-DIV-1002">
        <div style="z-index: 12;"><span id="LabelU2">LastName : </span>
        </div>
        <div style="z-index: 13;">
            <input name="LastName" type="text" id="LastName">
        </div>
    </div>
</div>
<div id="selected-column-2" class="span5 well droppedFields ui-sortable ui-droppable" style="float: left; width: 250px; margin-left: 10px; z-index: 14;">
    <div class="draggableField ui-draggable droppedField" style="z-index: 15;" id="CTRL-DIV-1004">
        <div style="z-index: 16;"><span id="LabelU5">Email : </span>
        </div>
        <div style="z-index: 17;">
            <input name="Email" type="text" id="Email">
        </div>
    </div>
    <div class="draggableField ui-draggable droppedField" style="z-index: 54;" id="CTRL-DIV-1001">
        <div style="z-index: 32;"><span id="LabelU3">Phone : </span>
        </div>
        <div style="z-index: 33;">
            <input name="Phone" type="text" id="Phone">
        </div>

＆＃13;

Answer 3

您可以使用.each()：

$('input').each(function() {
  console.log(this.name);
});

从innerHTML获取输入类型的名称

3 个答案: