2017-07-13 41 views
0

我在我的HTML中通过WordPress短代码构建了一些链接。不幸的是,这个简码不包括目标属性,这种方式我不能使链接在新标签中打开。按类获取元素并在新标签中打开它

我不是一个程序员,我正在寻找一个小JS来打开某个特定类下的某些链接,并在新选项卡中打开。

喜欢的东西:

if ("a" tag is under "div.newTab" class) onClick {window.open in a new tab} 

希望你们理解!

谢谢大家。

+0

[看这里](https://stackoverflow.com/questions/15880468/how-to-在新窗口中获得一个dom元素) –

+0

您是否需要在点击时评估该类,或者可以该链接将被标记为在新窗口中打开,具体取决于它是否具有加载类。 – Santi

回答

0
window.onload = function() 
{ 
    var allLinks = document.querySelectorAll("div.newTab a"); 
    for(var i=0;i<allLinks.length;i++) 
    { 
     var currentLink = allLinks[i]; 
     currentLink.setAttribute("target","_blank"); 
    } 
} 
+0

谢谢Ganesan !!!!它完美的工作! :D –

0

您可以通过循环遍历指定类下的所有链接来设置target属性。

Demo

(function(){ 
 

 
\t $(".newTab a").each(function(i, obj){ 
 
    
 
    \t obj.setAttribute("target", "_blank"); 
 
    
 
    }); 
 
\t 
 
})();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="newTab"> 
 
    <a href="https://bhansa.github.io">bhansa</a> 
 
    <a href="http://google.com">Google</a> 
 
</div>

0

如果你想避免操纵了很多网页上的链接,你可以使用jQuery赶在.newTab的div和行动链接的点击在他们。

例HTML

<div class="someClass"> 
    <a href="http://google.com">Google</a> 
</div> 

<div class="newTab"> 
    <a href="http://wikipedia.org">Wikipedia</a> 
</div> 

的javascript

$(document).ready(function($) { 
    $('.newTab a').click(function(event){ 
     event.preventDefault(); 
     window.open((this).href, '_blank'); 
    }); 
}); 

工作jsFiddle

0
$(document).on('click', 'div.newTab a', function(e){ 
    e.preventDefault(); 
    var url = $(this).attr('href'); 
    window.open(url, '_blank'); 
}); 
+1

尽管这段代码可能会回答这个问题,但提供关于如何解决问题和/或为什么解决问题的额外上下文会提高答案的长期价值。 – Badacadabra

相关问题