为什么blur（）不能工作？

 <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>test</title> 
    <script type="text/javascript" src="js/jquery.js"></script> 
    <script type="text/javascript"> 
    $('#target').blur(function() { 
alert('welcome,boy.'); 
    }) 
</script> 
    </head> 

<body> 
    <form> 
<input id="target" type="text" value="Field 1" /> 
<input type="text" value="Field 2" /> 
    </form> 
<div id="other"> 
    Trigger the handler 
</div> 

</body> 
</html>

jquery.js在我的js文件中，我把上面的代码放在一个名为test.html的文件中。当我点击第一个输入文本框然后点击其他地方。没有弹出警告框？为什么blur（）不能工作？

来源

2011-03-28 enjoylife

当浏览器在HTML中读取该脚本时，该脚本甚至在它看到主体之前立即运行。脚本运行时，#target元素尚不存在。

一个解决方案是将脚本移动到<body>的底部。另一个办法是使用jQuery的DOM功能齐全：

$(function() { 
    $('#target').blur(function() { 
     alert('welcome,boy.'); 
    }); 
});

在这种情况下，你仍然可以把脚本的头部和脚本本身将运行。但是，它会延迟运行$(function() { /* code here */ })包装内的部分，直到浏览器读取完所有的HTML并构建了其良好的DOM元素树。

来源

2011-03-28 02:44:57 Matchu

哈，打我33秒 – mnelson 2011-03-28 02:46:26

@mikeonrails：+1，无论如何。一个好的答案是一个很好的答案:) – Matchu 2011-03-28 02:46:57

类似的答案@mikeonrails，但你的解释更多。 – jessegavin 2011-03-28 03:01:02

这是因为执行代码时#target不存在。试试这个：

<script type="text/javascript"> 
    $(function(){ 
    $('#target').blur(function() { 
     alert('welcome,boy.'); 
    }); 
    }); 
</script>

来源

2011-03-28 02:45:30 mnelson

为什么blur（）不能工作？

回答

相关问题