在做表单验证时我们会经常遇到blur和click冲突的情况
举个栗子：
问题：当焦点在输入框时，点击取消按钮会触发blur和click事件，导致需要点击两次取消按钮才能关闭弹窗
原因：这是因为blur事件比click事件先触发，而 javascript为单线程，同一时间只能执行处理一个事件 ，所以当blur处理程序时，导致其后续click事件并不会执行
解决方案1：如果click事件比blur事件先触发就没有问题了，所以可以给blur事件延迟触发
解决方案2：将click事件改为mousedown事件，让其优先于blur事件执行（缺点是用户体验不好，鼠标按下便触发了事件）
解决方案3：给按钮添加一个mousedown事件，在其中执行event.preventDefault()阻止浏览器默认事件，这样点击按钮时输入框就不会失去焦点了
很简单，把冲突的部分改了。1.对象名不要重复。
2.调用页ID不要重复。
3.最容易出问题的部分在这:onload事件。
如果两个JS内都出现onload事件，那就会冲突。
你可用“查找”Ctrl+F键，找出所有的onload事件并且把onload事件调用的函数名或执行代码放到一起。
如:
第一种
window.onload=wgbf_moveit
第二种
window.onload=function(){
执行代码。。。。。
}
=================================
上面常见的onload事件使用方法。
你可以把onload事件写在一起。如下:
window.onload=function(){
wgbf_moveit//第一种:函数名
执行代码。。。。。//第二种:执行代码
}
冲突的原因:第一个中$被定义为jquery的对象了，而你第二个中有再次定义这样的全局变量，变量冲突了，解决的方法有两个:第一种，把你的第二个改成(推荐方法):
<script
type="text/javascript">
$(function
()
{
$("#nav").next().click(function(){
$(this).toggle()
})
})
</script>
第二种，把你的第二个改成(不推荐):
<script
type="text/javascript">
function
$$(id){return
document.getElementById(id)}//注意改成$$
window.onload
=
function(){
$$("nav").onclick
=
function(e){
var
src
=
e?e.target:event.srcElement
if(src.tagName
==
"H3"){
var
next
=
src.nextElementSibling
||
src.nextSibling
next.style.display
=
(next.style.display
=="block")?"none":"block"
}
}
}
</script>
有什么不明白的可以继续追问我。
