2014-01-12 59 views
0

嗨我有兩個Jquery函數。一個函數被設置爲哈希滾動,另一個在點擊時顯示模式。這些函數被鏈接到鏈接。我已設置與href="#"的空鏈接。但是,我的兩個鉤子互相干擾。如果我在我的第一個函數中檢查空hashlinks並返回一個false,那麼我的第二個圖庫中的第二個函數顯示圖像模式被取消激活。有沒有辦法解決。我確信明顯的答案是在我的函數中添加一些變量。但我想創建一個函數來檢查href="#"是否爲true,而不是滾動,但不會干擾Jquery可能會鏈接到該鏈接的任何其他函數。另外爲什麼兩個鉤子會相互干擾?Jquery On(「Click」)勾上互相干涉的鏈接

<div><a href="/#somelinkonpage">Some text</a><div> 
    <div id="gallery> 
    <div class="item"> 
    <a class="thumbnail thumbnail-sm" href="#" rel="tooltip"> 
     <img src="...jpg" class="img-rounded"> 
    </a> 
    </div> 
    <div> 

    //smooth scroll hashes function. 
    ('a[href*=#]').on('click', function() { 
        var href = $.attr(this, 'href'); 
        href = href.replace(/^\//, ''); 
        if (href == '#') { 
         return false;// but if I return false here modal does not work. 
        } 
        else { //smooth scroll code here } 
        return false;// if I return false here my modal function works. 
       }); 
    //Display gallery item in modal function. 
    $('#gallery').on('click', '.item a', function() { 
        $('#myModal').modal('show'); 
        return false; 
       }); 

編輯:我對這種行爲感到困惑

if (href == '#') { 
return false;// but if I return false here modal does not work. 
} 
else { //smooth scroll code here } 
return false;// if I return false here my modal function works. 

回答

1

當你從事件處理程序返回false,它可以防止<a>元素,的默認操作,但它也將終止事件的傳播 - 這意味着其他附加事件處理程序將不會得到執行。如果您希望平滑滾動跳轉鏈接的事件處理程序允許執行這些鏈接上的其他事件處理程序,則應該防止默認操作,但仍允許傳播該事件。你可以通過調用event.preventDefault()來完成,而不是返回false

啓動事件處理程序是這樣的:

$('a[href*=#]').on('click', function (event) { 
    event.preventDefault(); 
    ... 

和:

$('#gallery').on('click', '.item a', function (event) { 
    event.preventDefault(); 
    ... 

而且不會從他們返回false

0

這可能會發生,因爲第二種情況下使用事件委託,以便在第一事件被取消,它沒有泡代表團。試試這個:

$('#gallery .item a').on('click', function() { 
    alert("hhh"); 
    $('#myModal').modal('show'); 
    return false; 
}); 

希望這會有所幫助。乾杯

+0

我試過了,但還是沒有運氣:( –

0

你有沒有嘗試過這樣的事情?

('a[href*=#]').on('click', function() { 
    var href = $.attr(this, 'href'); 
    href = href.replace(/^\//, ''); 
    if (href != '#') { 
     //smooth scroll code here 
    } 
    return false; 
}); 
+0

我試過了,這個不行,我想我只是用event.preventdefault(); –