有人可以向我解释一下为什么这不起作用吗？
抱歉，我完全是 javascript + jQuery 的初学者。
代码如下:
Javascript/jQuery:
<script type="text/javascript">
$('.clickk').click(function(e){
window.location.href = $(this).find('a').attr('href');
});
</script>
HTML:
<div class="clickk" >
<a href="google.com">link</a>
blah blah blah.
</div>
请帮我找到我丢失的东西。
提前致谢。希望问题很清楚。
最佳答案
两个可能的问题:
您可能会在 DOM 中存在具有该类的任何元素之前执行该脚本(更多内容见下文)。
href应以http://开头，例如href="http://www.google.com"或href="http://google.com"。仅href="google.com"使其成为相对链接，但无法可靠地工作。
假设您修复了 #2，以下是有关 #1 的一些详细信息:
不起作用:
<!-- ... -->
<head>
<!-- ... -->
<script type="text/javascript">
$('.clickk').click(function(e){
window.location.href = $(this).find('a').attr('href');
});
</script>
</head>
<body>
<!-- ... -->
<div class="clickk" >
<a href="http://google.com">link</a>
blah blah blah.
</div>
有两种方法可以解决此问题:
将脚本放在页面末尾
这通常是首选方式，将脚本放在页面的末尾，而不是开头。
作品:
<body>
<!-- ... -->
<div class="clickk" >
<a href="http://google.com">link</a>
blah blah blah.
</div>
<!-- ... -->
<script src="jquery.js"></script>
<script type="text/javascript">
$('.clickk').click(function(e){
window.location.href = $(this).find('a').attr('href');
});
</script>
</body>
这还可以减少明显的页面加载时间，因为在等待脚本下载时不会阻止渲染。请参阅YUI's guidelines (或其他几个中的任何一个)。脚本上方定义的 DOM 元素可供该脚本访问。脚本下面定义的 DOM 元素不是(除非您执行如下操作来延迟操作)。
使用ready事件
如果由于某种原因不适合将脚本放在最后，您可以使用 ready事件:
作品:
<!-- ... -->
<head>
<!-- ... -->
<script type="text/javascript">
jQuery(function($) {
$('.clickk').click(function(e){
window.location.href = $(this).find('a').attr('href');
});
});
</script>
</head>
<body>
<!-- ... -->
<div class="clickk" >
<a href="http://google.com">link</a>
blah blah blah.
</div>
请注意，将函数传递到 jQuery(或 $，这只是 jQuery 的别名，除非您使用 noConflict ) 与将 1 传递给 $(document).ready(...) 相同；详情:http://api.jquery.com/jQuery/#jQuery3
关于javascript - jQuery div 可点击并跟随子 URL，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12660361/