點擊jQuery中的函數衝突

我想添加一個點擊函數處理程序來重定向到某個鏈接。我有一個父div，它有一個點擊處理程序重定向到google.com，並在父div中，我有一個錨點標籤指向yahoo.com的細分。如果我點擊包含yahoo.com鏈接的子div，它現在會轉到google.com。我如何克服這個問題？點擊jQuery中的函數衝突

我已創建JSFIDDLE。下面是HTML代碼：

<div class="maindiv"> 
    <div class="subdiv"> 
     <a href="http://yahoo.com">Click Me</a> 
    </div> 
</div>

和Javascript代碼：

jQuery('.maindiv').click(function() { 
    window.open('http://google.com');  
});

我想在點擊父DIV應該採取用戶google.com但父DIV中的任何鏈接應該採取用戶適當的鏈接。

謝謝！

來源

2013-11-15 Vignesh Pichamani

請接受以下正確的答案。 Upvoting很好，但標記正確將有助於該網站的未來用戶（以及我）。 – Chandranshu

下面是更新後的代碼：http://jsfiddle.net/c2XJf/23/

具體來說，您需要停止click事件的傳播上的錨標記是這樣的：

$('.subdiv a').click(function(event){ 
    event.stopPropagation(); 
});

，如果你想打開的鏈接在新標籤/窗口錨標記，目標屬性添加到您的HTML這樣的：

<a href="http://yahoo.com" target="_new">Click Me</a>

來源

2013-11-15 07:59:39 Chandranshu

我只是去'window.open（this.href）'保持它的通用性，但是，是的，這是正確的解決方案。 – hayavuk

+1感謝您的信息。這麼晚纔回復很抱歉。我試過這個代碼，它工作完美。但我想給它一個窗口。打開爲父div本身，而不是你的情況下的子div我需要給子窗口的window.location太正確！我想省略子div的window.location執行功能，如果我點擊那裏的href重定向yahoo.com？ –

在代碼中查看我的評論。這部分是沒有必要的。我只是把它添加到你的處理程序之間有相似之處。我已經更新了小提琴和代碼。這不是你想要的嗎？ – Chandranshu

檢查，如果目標格是當前DIV ..

試試這個

jQuery('.maindiv').click(function(e) { 
if(e.target == this){ 
    window.open('http://google.com'); 
} 
});

來源

2013-11-15 08:01:47 bipen

$('a').click(function(){window.open('http://yahoo.com');});

來源

2013-11-15 08:02:21

這不會阻止google.com的開放，因爲事件會冒泡到原始處理程序。 – Chandranshu

就可以解決這個問題，簡單地檢查單擊元素的標籤名並重定向到相應的頁面。

jQuery('.maindiv').click(function(event) { 
    var target = $(event.target); 
    //checks if a tag has been clicked or not 
    if(!target.is('a')){ 
     window.open('http://google.com'); 
    } 
    else{ 
     window.open("http://yahoo.com"); 
    } 
});

Demo

來源

2013-11-15 08:14:18

HTML代碼：

<div class="maindiv"> 
    <div class="subdiv"> 
     <a href="#">Click Me</a> 
    </div> 
</div>

jQuery代碼：

jQuery('.maindiv').click(function() { 
    window.open('http://google.com');  
}); 
jQuery('.maindiv').find('a').click(function() { 
    window.open('http://yahoo.com');  
});

來源

2013-11-15 08:19:48

jQuery代碼：

$('.subdiv a').click(function(event){ 
    event.stopPropagation(); 
    window.open('http://yahoo.com'); 
}); 
$('.subdiv').click(function(event){ 
    window.open('http://yahoo.com'); 
}); 
$('.maindiv').click(function(event){ 
    window.open('http://google.com'); 
});

您可以設置寬度樣式來細分顯示重定向完美。

更新後的代碼是： http://jsfiddle.net/c2XJf/22/

來源

2013-11-15 08:48:29

點擊jQuery中的函數衝突

回答

相關問題