我想完成正在做的事情here除了一个转折: 我希望每个事件都针对不同的元素。
用例是一个选择框,除了第一个"选择你的选项"选项已选中
$(document).on('change', 'select:nth-child(1)', function(e) ){
do_stuff();
});
$(document).on('click', 'select:not(:first-child)', function(e) ){
do_stuff();
});
是否有一种组合的,更简洁的方法来执行此操作,而无需创建do_stuff()
?
如果没有两次事件发射,怎么办呢?
答案 0 :(得分:1)
测试函数中的位置。
$(document).on("change click", "select option", function(e) {
if ($(this).index() == 0) {
// do stuff for first child
} else {
// do stuff for other children
});
但是,我不认为在change
元素上触发<option>
事件,它只是在<select>
本身触发。因此,您的基本前提似乎是错误的,因为change
事件永远不会触发select:nth-child(1)
。
答案 1 :(得分:1)
你有答案,但你也可以使用这个的一些组合:
注意:选项卡到页面上的元素以触发focusin
事件
$('#selectcontainer').on('change focusin manual', ".myselectthing", function(e) {
var selectionIndex = $(this).prop('selectedIndex');
$('#results').text("this type " + e.type + ":" + $(this).val() + " : " + selectionIndex);
});
$('#selectcontainer').find('.myselectthing').val("ralf").trigger("manual");
一些示例标记:
<div id="results">
empty
</div>
<div id="selectcontainer">
<select class="myselectthing">
<option value="me">choose me</option>
<option value="ralf">choose ralf</option>
<option value="charlie">choose charlie</option>
</select>
</div>