使用jquery hide（）和show（）時，div上的鏈接不可點擊包含div

我在頁面中存在一個位於div內部的鏈接問題。目前，當鏈接被點擊時，什麼都不會發生。我不明白爲什麼，但我想它與包含div的hide（）和show（）的使用有關，我將在下面解釋它。使用jquery hide（）和show（）時，div上的鏈接不可點擊包含div

DIV的是定製的「手風琴」，它採用以下jQuery來打開/關閉適當的div的一部分被點擊的標題時：

$('.accordion .head').click(function() { 
    $('.accordion .head').next().hide(); 
    $('.accordion .head').removeClass("active"); 

    $(this).next().show('fast'); 
    $(this).addClass("active"); 
    return false; 
});

據我所知，有更好的方法來實現「手風琴「的行爲，但是因爲這是在我們的網站上使用的，所以我沒有更新手風琴的使用實際的Jquery accordion（）方法而沒有爲我自己做很多額外的工作的選項。

因此，考慮到如下的示例代碼任何人可以幫助我瞭解的問題是在這裏什麼，或者如何克服呢？

<div class="accordion"> 
    <div class="head active"><a href="#">Heading 1</a></div> 
    <div class="accordion-content first"> 
     <p> 
      Some text here 
     </p> 
     <div class="accordion-logos"> 
     </div> 
    </div>    
    <div class="head"><a href="#">Heading 2</a></div> 
    <div class="accordion-content"> 
     <p> 
      Some other text here 
     </p> 
     <p> 
      <a href="http://www.google.com">http://www.google.com</a>          
     </p> 
    </div>    
</div>

我甚至無法獲得的點擊，當我處理它專門登記，在代碼中的警報之下永遠不會觸發時，鏈接被點擊：

$('.accordion .accordion-content #thelink').click(function() { 
    alert(); 
    });

謝謝你，

玫瑰

來源

2012-08-15 Lindsay Rose

[此的jsfiddle示例]（http://jsfiddle.net/DrS5f/）與代碼您提供不到風度塊從發射谷歌的鏈接，導致我相信一定會有一些其他的JavaScript劫持點擊事件比你提供 – 2012-08-15 15:49:59

嗨西蒙，感謝您的幫助。我查看了JSFiddle的例子，我可以看到你是對的，鏈接應該工作，除非有其他的JavaScript阻止。我將不得不關閉一個腳本，直到我能找出原因。感謝您花時間看這個！ – 2012-08-15 16:19:32

@LRose：我編輯了我的答案，現在我正確地理解了這個問題，並提供了一些關於如何查明可能出錯的建議。 – Nope 2012-08-15 16:25:24

好像我身邊誤解你的第一次。

如果谷歌鏈接不火，那麼有兩種東西擋住一個環節，覆蓋鏈接的href或者甚至另一個因素是在它的面前，你不能點擊鏈接。

如果有人想阻止鏈接到工作，他們可以做這樣的事情：

$('.accordion .accordion-content a').click(function(){ 
    return false; 
});

如果您要檢查，如果這是你可以嘗試解除綁定的一切，請檢查您是否可以點擊鏈接的情況下然後：

$('.accordion .accordion-content a').unbind('click');

還要檢查你的HTML輸出，看看有什麼href值設置爲，也許有人已經覆蓋它。

只需進入渲染頁面，右鍵單擊並選擇view-source。搜索谷歌鏈接並檢查href值。

來源

2012-08-15 15:37:09 Nope

嗨，弗朗索瓦，你是正確的，在我發佈之前，我不小心刪除了鏈接上的id。我嘗試了你提供的兩個選項，即使它顯然應該基於你提供的演示工作，但我仍然沒有在實際頁面上得到警報。我真的開始認爲頁面上的另一個腳本在這裏引起問題。非常感謝您閱讀本文！ – 2012-08-15 16:23:09

@LRose：我現在更新了我的答案。我最初誤解了你的問題。我添加了一些關於如何幫助您排除鏈接不會讓您點擊它的問題的建議。我假設我們正在談論你無法獲得谷歌鏈接火:) – Nope 2012-08-15 16:26:23

嗨弗朗索瓦，再次感謝您的幫助，這是如此神祕！我嘗試了您提供的第二個片段，但該鏈接仍然無法點擊，我還查看了呈現的頁面內容，並且href值已完成。我認爲你可能有一些你提到的頁面上的另一個元素可能會阻止鏈接被點擊。我將不得不挖掘頁面上所有元素的CSS，看看是否有什麼可以做到這一點。再次感謝您的幫助！ – 2012-08-15 17:10:18

-1

爲什麼使用#thelink？如果我只用a替換它就行。

$(function(){ 
    $('.accordion .head').click(function() { 
    $('.accordion .head').next().hide(); 
    $('.accordion .head').removeClass("active"); 

    $(this).next().show('fast'); 
    $(this).addClass("active"); 
    return false; 
    }); 

    $('.accordion .accordion-content a').click(function() { 
    alert(); 
    }); 
})

來源

2012-08-15 15:37:30

嗨EH_warch，我只使用一個ID，因爲我已經測試過選擇div中的任何鏈接。我相信這會比使用特定的id更好，因爲我可以自定義該函數以適用於任何鏈接。感謝您審查我的問題！ – 2012-08-15 16:26:14

well ID對於頁面來說是獨一無二的，所以你不需要使用'class id'類型的選擇器。我建議你使用錨選擇器，因爲你的HTML上沒有id – 2012-08-15 17:13:56

我是有無法點擊鏈接的問題，我碰到這個職位後來試圖找到答案。問題是，在我的頭下面的div元素上觸發了jquery hide（）後，我的頭中的鏈接無法點擊。我將代碼更改爲slideUp（）而不是hide（），鏈接可點擊。我不確定這是否解決了您在本文中指定的問題，但是看到它是相關的，我認爲我會分享它，因爲它可能會幫助任何遇到此帖的人。它不如.hide（）適合，但是可用的解決方法。

$('#mydiv').slideUp();

來源

2014-06-11 10:05:37 Sarah

使用jquery hide（）和show（）時，div上的鏈接不可點擊包含div

回答

相關問題