例如,我正在尝试将 jquery 效果与 html 链接结合起来: 当我点击一个链接时,它应该显示母版页中的特定 div,它还应该导航到所需的页面,下面是我用来实现此目的但没有成功的代码:
<script type="text/javascript">
$(document).ready(function () {
$('#services-sub-menu').hide();
$('#services').click(function () {
$('#services-sub-menu').show("slow");
return false;
});
});
<div class="Menu2"><a href="/articles" id="articles">ARTICLES</a><br /> <a href="/services" id="services">TESTIMONIALS</a><br /><a href="#" id="contact">CONTACT US</a></div>
</div><div class="sub-menu">
<div id="services-sub-menu"><a href="/services-submenu" /></div>
</div>
jquery 效果正常但页面没有导航到服务页面
最佳答案
通过在点击结束时返回 false,您基本上告诉浏览器停止其默认行为。
这在 jQuery 中的等价物是:
event.preventDefault();
在哪里
$('#services').click(function (event) {
删除您的 return false
将允许链接按预期工作,但它可能会在您的动画完成之前重定向。
您可以做的是向 show 方法添加一个回调,并在其中使用 Javascript 进行重定向。
$('#services-sub-menu').show("slow",function(){
// Stuff that will happen when animation has completed
window.location.replace(redirectionUrl);
});
更新
这是一个非常基本的工作示例:http://jsfiddle.net/XakkU/
<a href="http://www.google.com" id="clicker">Click me </a>
<div id="showMe">Hold on, we're taking off!</div>
$('#clicker').click(function(event){
$('#showMe').show('slow',function(){
window.location.replace($('#clicker').attr('href'));
});
event.preventDefault();
});
关于jquery - Html 链接不能与 jquery 效果结合使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7447324/