exp:
<div id="test">
<ul>
<li><input name="name[]" type="text" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li></ul>
//注意一下,以下的ul元素是clone出来的
<ul>
<li><input name="name[]" type="text" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li>
</ul>
</div>
---------script--------------
<script>
$(function(){
$("#test > ul:eq(0) > li > input:eq(0)").bind({
focus:function(){
alert('绑定了鼠标移动事件');
},
blur:function(){
alert('绑定了鼠标离开事件');
}
})
})
</script>这些都没有问题,问题是,当我鼠标移到第二个ul的第一个input的时候,事件也有效了,我这里不需要有效,请问有什么方法可以改进
<div id="test">
<ul>
<li><input name="name[]" type="text" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li></ul>
//注意一下,以下的ul元素是clone出来的
<ul>
<li><input name="name[]" type="text" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li>
</ul>
</div>
---------script--------------
<script>
$(function(){
$("#test > ul:eq(0) > li > input:eq(0)").bind({
focus:function(){
alert('绑定了鼠标移动事件');
},
blur:function(){
alert('绑定了鼠标离开事件');
}
})
})
</script>这些都没有问题,问题是,当我鼠标移到第二个ul的第一个input的时候,事件也有效了,我这里不需要有效,请问有什么方法可以改进
$("#test ul:first li :input:first").bind({
focus:function(){
alert('绑定了鼠标移动事件');
},
blur:function(){
alert('绑定了鼠标离开事件');
}
})
})
focus和blur事件会有响应
<ul>
<li><input name="name[]" type="text" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li></ul>
//注意一下,以下的ul元素是clone出来的
<ul>
<li><input name="name[]" type="text" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li>
</ul>
</div>我只想在第一个ul中的第一个input中绑定事件第二个ul是我用jquery clone出来的,明白不?但是我点第二个ul的第一个input也会触发事件,我现在不需要,只要在第一个ul中的input触发就行了,clone出来的都不需要触发事件
是的,你说的没错,不管怎么样测试,先点还是后点,第二个ul中的第一个input也会响应。这就是我头疼的地方
<ul>
<li><input name="name[]" type="text" id="n1" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li></ul>
//注意一下,以下的ul元素是clone出来的
<ul>
<li><input name="name[]" type="text" id="n2" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li>
</ul>
</div>
<script>
$(function(){
$("#test ul:first li :input:first").bind({
focus:function(){
alert($(this).attr("id")+':focus事件被激活');
},
blur:function(){
alert($(this).attr("id")+':blur事件被激活');
}
})})
</script>我给第一个ul的input的ID命名为n1,第二个ul的第一个input命名为n2;自己看清楚吧
我真是崩溃。第一个ul的第一个input你绑定的是blur,也就是说你鼠标离开它,在任意地方点击,都将执行被绑定的blur事件。跟第二个什么的有个毛关系呀
对,我也是这样认为的,但目前情况就是这样,很迷茫,第二个ul中的第一个input也会响应事件,可爱吧
<div id="test">
<ul>
<li><input name="name[]" type="text" id="n1" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li></ul>
//注意一下,以下的ul元素是clone出来的
<ul>
<li><input name="name[]" type="text" id="n2" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li>
</ul>
</div>
<script>
$(function(){
$("#test ul:first li :input:first").bind({
focus:function(){
alert($(this).attr("id")+':focus事件被激活');
},
blur:function(){
alert($(this).attr("id")+':blur事件被激活');
}
})})
</script>
<ul>
<li><input name="name[]" type="text" value="" /></li>
<li><input name="sex[]" type="text" value="" /></li>
</ul>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#test ul").clone().appendTo("#test");//先克隆后绑定
$("#test ul:eq(0) li:eq(0) input").bind({
focus:function(){
alert('绑定了鼠标移动事件');
},
blur:function(){
alert('绑定了鼠标离开事件');
}
})
})
</script>