今日同事很正式的向我提出了兩個關於jquery的問題,我也很正式得做了回答,順便把源碼貼到這裡希望對朋友們有所幫助:
。 代碼如下:
<script type="text/javascript">
$(function(){
$("input[type=button]").click(function(){
alert($(this).index());
})
})
</script>
<ul>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
<li><input type="button" value="按鈕一" /></li>
</ul>
問題一：為什麼現在彈出來每個button（在ul>li中的）的索引值都是零，為什麼不是從0-9排列的；
答:第一個匹配元素的 index，相對於同胞元素,獲得第一個匹配元素相對於其同胞元素的 index 位置。請注意是"同胞".
。 代碼如下:
<script type="text/javascript">
$(function(){
$("input[type=button]").click(function(){
alert($(this).index());
})
})
</script>
<ul>
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
<input type="button" value="按鈕一" /><br />
</ul>
問題二：為什麼在button不在ul>li中，並且每個button後面加<br />的時候，彈出button的索引值翻了一倍，是從0-18的啊？
答:因為<br />也是同胞元素.
以下是在百度百科中查到的"同胞"的含義:
同父母所生的，例如同胞兄弟；