如何使用jQuery选择器来定位这些元素？

我想知道如何编写一个jQuery选择器来选择下面的每个“输入”项目。我不想一次选择它们。这些输入框不会有名称或ID。我可能必须使用某种儿童符号，但我不知道如何去做。如何使用jQuery选择器来定位这些元素？

<div id="partdiv"> 
    <div class="floater"> 
    <input type="text"/> // Some input box with no id or name 
    </div> 
    <div id="descriptiondiv"> 
    <div class="floater"> 
     <input type="text"/> // Some input box with no id or name 
    </div> 
    <div id="positiondiv"> 
     <div class="floater"> 
     <input type="text"/> // Some input box with no id or name 
     </div> 
    </div> 
    </div> 
</div>

对于第一个，比如，我想：

$("#partdiv > input").bind(....

，但没有奏效。

来源

2011-11-17 AKWF

你打算跟他们做什么？ – roselan

有很多不同的方法来做到这一点 - 每个方法都有不同的折衷。您可以使用这些选择：

"#partDiv input:first" 
"#descriptiondiv input:first" 
"#positiondiv input"

或者这些：

"#partDiv input:eq(0)" 
"#partDiv input:eq(1)" 
"#partDiv input:eq(2)"

或者这些：

"#partDiv > .floater > input" 
"#descriptiondiv > .floater > input" 
"#positiondiv > .floater > input"

注意，认为 “正确” 的方式做到这将是给每个输入它是自己的ID或放在一个有id的容器（在同一容器中没有其他输入标签）。既然这些都不是真的，你必须使用位置或层次信息来辨别哪个输入是哪个。

要使用这些不同方法中的哪一种取决于您希望确切的HTML结构和选择器之间的关系有多紧密或松散（例如，选择器是否仍然适用于某些类型的HTML更改）。

第一个选项的优点是它不关心div和输入之间有多少级别/层次的标记，只是您要在每个div中选择第一个输入元素。第三个选项将选择器绑定到非常特定的HTML实现，并且如果您在partDiv和输入之间放置了一个额外的div，它将停止工作。如果你这样做，第一个不会停止工作，所以第一个和第二个比第三个脆弱得多。

第二个选项的优点是它完全独立于partDiv内部的标记。它唯一关心的是该div中的第一，第二和第三个输入字段。

第三个选项的主要优点是，您可以重新排列三个输入字段的顺序，只要您保持选择器中指定的层次结构的唯一性，选择器仍然可以工作。

来源

2011-11-17 01:25:31 jfriend00

这是否帮助：

 
$("#partDiv > input").live("click", function() { 
    alert($(this).val()); 
});

来源

2011-11-17 01:24:32

$('input').bind('...

每个输入将被绑定到你想要的事件（点击，变更，等等）。

当你在事件函数中时，“this”对应于发生事件的那个输入。（即一个点击），

或者你可以使用$('input').click(...，或$('input').change(...

，但我请你阅读文档上.on()，事件粘合剂团结他们。

来源

2011-11-17 01:24:46 roselan

"#partdiv > input"不起作用，因为您只选择了'#partdiv'的直接子元素'>'。

这些会做

1st input: $("#partdiv>.floater>input") 
2nd input: $("#descriptiondiv>.floater>input") 
3rd input: $("#positiondiv>.floater>input")

我注意到你的div被包裹在一个奇怪的方式，就是你真正的意思？

来源

2011-11-17 01:24:59

伙计们，我想OP说：“我不想一次选中它们”。 –

$("#partdiv > input")说要选择一个输入，它是ID为partdiv的元素的直接子元素。要在元素partdiv下的任何地方找到输入，您可以使用$("#partdiv input")。但是，由于它们全都从#partdiv下降，所以它会立即获得所有输入。所以，你需要进一步打破它：

$('#partdiv .floater input') //gets an input which lives under element with class floater which itself lives under element with ID partdiv

等..

注意，有很多很多方法对皮肤这只猫。

来源

2011-11-17 01:26:26 JAAulde

如何使用jQuery选择器来定位这些元素？

回答

相关问题