Jquery插件在URL中创建不需要的#

时间:2012-11-13 00:01:33

标签: javascript jquery url

我有一小段javascript来支持我的jquery滑块上的一些功能,例如导航。最近我注意到,当你点击导航按钮时,它会按照它的设想做,但也会在URL“#”中创建一个额外的字符。我已经检查了脚本并找到了它的添加位置和原因,但是在点击导航时没有添加如何修复它,我不知道。是否有人可以帮助或至少指出我正确的方向。请参阅下面的完整代码

var fadeTimer;
var slideSpeed = 8000;
jQuery(document).ready(function() {
// add nav buttons
var slideCount = jQuery('#fader ul li').length;

var randomnumber=Math.floor(Math.random()* slideCount);

for ($i = 0; $i < slideCount; $i++) {
jQuery('#faderNav').prepend('<a href="#"><\/a>');
}

jQuery('#faderNav a').eq(randomnumber).addClass('active');
jQuery('#fader ul li').eq(randomnumber-1).addClass('active');

var next = jQuery('#fader ul .active').next();
if (next.length > 0) {

} else {
var next = jQuery('#fader ul li:first');
}

jQuery('#fader ul .active').fadeOut().removeClass('active');
next.fadeIn().addClass('active');

// work out nav width
var navBtn = jQuery('#faderNav a');
var navBtnWidth = navBtn.outerWidth(true);
var navWidth = navBtn.length * navBtnWidth;
// set nav width
jQuery('#faderNav').width(navWidth);
// add negative margin to center the nav
var negMarg = navWidth / 2;
jQuery('#faderNav').css({'margin-left':'-'+negMarg+'px'});

// start timer

var fadeTimer = setInterval("faderTimer()", slideSpeed);


jQuery('#faderNav a').live('click',function() {
clearInterval(fadeTimer);
var index = jQuery(this).index('#faderNav a');
jQuery('#faderNav a').removeClass('active');
jQuery('#faderNav a').eq(index).addClass('active');
jQuery('#fader ul .active').fadeOut().removeClass('active');
jQuery('#fader ul li').eq(index).fadeIn('slow').addClass('active');
});
});


// FADE FUNCTION
function faderTimer() {
var next = jQuery('#fader ul .active').next();
if (next.length > 0) {

} else {
var next = jQuery('#fader ul li:first');
}

var navIndex = next.index('#fader ul li');
jQuery('#faderNav a').removeClass('active');
jQuery('#faderNav a').eq(navIndex).addClass('active');
jQuery('#fader ul .active').fadeOut().removeClass('active');
next.fadeIn('slow').addClass('active');

}

3 个答案:

答案 0 :(得分:1)

$(document).on("click", "a[href=#]", function(e) {
    e.preventDefault();
});

http://jsfiddle.net/RhNDB/show/

答案 1 :(得分:1)

单击带有href="#"的锚点会将hashsign添加到网址。

使用preventDefault或return false:

jQuery(document).on('click', '#faderNav a', function(e) {
    e.preventDefault();
    clearInterval(fadeTimer);
    var index = jQuery(this).index('#faderNav a');
    jQuery('#faderNav a').removeClass('active');
                         .eq(index).addClass('active');
    jQuery('#fader ul .active').fadeOut().removeClass('active');
    jQuery('#fader ul li').eq(index).fadeIn('slow').addClass('active');
});

答案 2 :(得分:1)

return false;处理程序的末尾添加click。这将阻止页面导航到href属性的值。