javascript - Jquery选择多个输入而不使用id

Question

我有一段这样的代码:

<div class="container">

    <div class="row">
        <div class="col">
            <input class="form-control" type="text" id="#first">
        </div>
        <div class="col">
            <input class="form-control" type="text" id="#second">
        </div>
        <div class="col">
            <input class="form-control" type="text" id="#third">

        </div>
    </div>


</div>

如果我想获取每个输入的文本，我可以简单地使用 jquery id 选择 ($('first).text())因为我知道有很多方法可以选择 dom 元素，有没有一种好的方法可以不使用 id 选择器来选择每个元素？

Answer 1

使用评论中建议的$("input[type=text]") Carsten。 (还要根据您的语法观看他的提示)

如果您想使用这些元素(例如验证)，您可以使用 jquery 中的 .each() 函数并使用 $(this):

$("input[type=text]").each(function( index ) {
  var test = $(this).val();
});

这里还有一些选择这些输入的其他可能性:

类别

给它们相同的类，并让选择器像这样 $(".yourClass")

父级

给出您想要选择特定类的所有输入的容器 $(".yourContainerClass input") 或更精确的 $(".yourContainerClass input[type=text] ”)

属性

像type一样，您可以访问输入字段的每个属性，如下所示:$("[attribute='value']")这可能是名称 值或您喜欢的任何内容

这里您可以根据w3schools了解属性选择器的概述。 :

• [属性] - 例如。 $("[href]") - 所有具有 href 属性的元素
• [属性!=值] - 例如。 $("[href!='default.htm']") - href 属性值不等于“default.htm”的所有元素
• [属性$=值] - 例如。 $("[href$='.jpg']") - href 属性值以“.jpg”结尾的所有元素
• [attribute|=value] - 例如 $("[title|='Tomorrow']") - 标题属性值等于 'Tomorrow' 或以 ' 开头的所有元素明天' 后跟连字符
• [属性^=值] - 例如。 $("[title^='Tom']") - title 属性值以“Tom”开头的所有元素
• [属性~=值] - 例如。 $("[title~='hello']") - title 属性值包含特定单词“hello”的所有元素
• [属性*=值] - 例如。 $("[title*='hello']") - title 属性值包含单词“hello”的所有元素