0

我不能在标题中使用脚本，这是代码：

<!DOCTYPE html>
<html>
<head> 

<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
 <a href="javascript:void" class="sl-start">Click Here</a> 
<p class="slide" style="display: none">Something to display</p>

<script>
    $(".sl-start").click(function () {
    $(".slide").show();
    });
    </script>
</body>
</html>
4

3 回答 3

4

将代码包装在 document.ready 事件处理程序中，如下所示：

<!DOCTYPE html>
<html>
<head> 

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
        $(document).ready(function(){
            $(".sl-start").one('click', function () {
                $(".slide").show();
            });
        });
    </script>
</head>
<body>
 <a href="javascript:void" class="sl-start">Click Here</a> 
<p class="slide" style="display: none">Something to display</p>

</body>
</html>

否则，脚本将在元素存在之前执行！

于 2012-08-21T13:09:19.443 回答
0

因为 DOM 尚未准备好附加事件的头部。

如果在document's 的 ready 事件触发时让它运行，它将起作用：

$(document).ready(function(){
    $(".sl-start").click(function () {
        $(".slide").show();
    });
});
于 2012-08-21T13:09:32.113 回答
0

如果你想在 <head> 区域使用它，那么你必须使用 $(document).ready() 事件。

<script type="text/JavaScript">
    $(document).ready(function() {
        $(".sl-start").click(function () {
            $(".slide").show();
        });
    });
</script>

或简写：

$(function() {
    ...
});

因为在读取 HTML/CSS 文档后会触发 $(document).ready() 事件。这意味着浏览器已经知道 HTML 文档的全部内容和结构。

否则 HTML 结构不可用（尚未完全阅读），因此您的 jQuery 调用将无法找到任何对象。

于 2012-08-21T13:09:50.350 回答