日期:2014-05-17  浏览次数:20713 次

js 放在html 的位置 不同 造成的结果页不相同

例子1、代码可以正常执行:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
<head>
? <style>span {display:none;}</style>
? <script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>

? <script>
??? $(document).ready(function() {
??? ??? $("input").focus(function () {
??? ??????? $(this).next("span").css('display','inline').fadeOut(1000);
??? ??? });
??? });
? </script>

<body>

? <p><input type="text" /> <span>focus fire</span></p>
? <p><input type="password" /> <span>focus fire</span></p>


</body>
</html>

?

?

?

例子2、代码可以正常执行:

?


<!DOCTYPE html>
<html>
<head>
? <style>span {display:none;}</style>
? <script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
? <p><input type="text" /> <span>focus fire</span></p>

<p><input type="password" /> <span>focus fire</span></p>
<script>
??? $("input").focus(function () {
???????? $(this).next("span").css('display','inline').fadeOut(1000);
??? });
</script>

</body>
</html>

?

例子3、代码中的js不能正常执行

?

<!DOCTYPE html>
<html>
<head>
? <style>span {display:none;}</style>
? <script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>

<script>
??? $("input").focus(function () {
???????? $(this).next("span").css('display','inline').fadeOut(1000);
??? });
</script>


<body>
? <p><input type="text" /> <span>focus fire</span></p>

<p><input type="password" /> <span>focus fire</span></p>

</body>
</html>

?

?