Question

如果我有这段代码：

 <div id="one">
        <label>first</label> 
        <select name="area" class="area">
        <option selected="selected">First</option>
    </div>

 <div id="two">
        <label>second</label> 
        <select name="area" class="area">
        <option selected="selected">Second</option>
 </div>

有可能是这样的吗？

  $("#one: .area").change(function() {}

or 

 $("#two: .area").change(function() {}

它不起作用，有人可以解释原因吗？

Answer 1

尝试：

<div id="one">
        <label>first</label> 
        <select name="area" class="area">
        <option selected="selected">First</option>
         </select>
    </div>

 <div id="two">
        <label>second</label> 
        <select name="area" class="area">
        <option selected="selected">Second</option>
        </select>
 </div>

$("#one select.area").change(function() {}

Answer 2

删除代码中的: ... $("#one .area") 关闭选择元素</select>

也是一种很好的做法

Answer 3

这可能是你想要的

$("#one > select.area").change(function() {});

或

$("#two > select.area").change(function() {}

另外请确保结束您的选择标记。您有以下HTML

<div id="one">
    <label>first</label> 
    <select name="area" class="area">
    <option selected="selected">First</option>
</div>

应该是

<div id="one">
    <label>first</label> 
    <select name="area" class="area">
        <option selected="selected">First</option>
    </select>  <!-- Note the Ending tag for the select -->
</div>

Answer 4

是的，但您应该删除选择器中的:。

$("#one .area").change(function() { alert($(this).val()) });

Answer 5

您的选择器中还有一个额外的:，请使用：$("#one .area").change(function() {});

请参阅此示例：http://jsfiddle.net/fermin/9YM3a/1/

Answer 6

如果您询问如何选择.area或#one的孩子的#two，那么您几乎可以正确使用它。

$('#one > .area').change(function() {}

>表示“孩子”，因此您将选择.area的孩子#one

Answer 7

您可以将div设置为范围。

$('.area',$(this).parent('div:one')).change(function() {}

关于div的课的问题

7 个答案: