使JS函数更高效，更动态

Question

我目前在html页面中使用了这3个函数：

$('#windowPanel1:first-child').children('div:eq(0)').click(function(){
    $('#edit1').val("1");
});
$('#windowPanel1:first-child').children('div:eq(1)').click(function(){
   $('#edit1').val("2");
});
$('#windowPanel1:first-child').children('div:eq(2)').click(function(){
    $('#edit1').val("3");
});

我想有一个涵盖所有这些功能的功能。什么是最有效的方式？谢谢！

Answer 1

将事件绑定到div元素的所有直接后代#windowPanel1:first-child元素。使用index()获取被点击元素的索引。返回的index是从零开始的索引。

$('#windowPanel1:first-child > div').click(function() {
    $('#edit1').val($(this).index() + 1);
});

>为direct descendant/child selector，会返回与.children('div')相同的元素。