用于打开新窗口的 JQuery 链接
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17105420/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery links to open new window
提问by Banny
I'm trying to improve a music player i've created for my website by moving in from in-browser to a separate pop-up window, i've created/manipulated code i've found to make the jQuery take the href value and send it to a new window, only issue is on clicking the <a>tag, it performs the href click and jQuery action (as it would do). I'm trying to find an efficient way to make it so that if a user has JavaScript disabled, they can at least use the music player in a new tab rather than not being able to listen at all, but i'm unsure of how to go about this. Would setting the elements href into a var, then removing the href attribute work? Or would this cause errors?
我正在尝试通过从浏览器内移动到单独的弹出窗口来改进我为我的网站创建的音乐播放器，我已经创建/操作了我发现使 jQuery 采用 href 值的代码并将其发送到一个新窗口，唯一的问题是单击<a>标签，它执行 href 单击和 jQuery 操作（就像它会做的那样）。我试图找到一种有效的方法来实现它，以便如果用户禁用了 JavaScript，他们至少可以在新标签中使用音乐播放器，而不是根本无法收听，但我不确定如何去做这件事。将元素 href 设置为 var，然后删除 href 属性是否可行？或者这会导致错误吗？
Example HTML:
示例 HTML：
<a href="this_page.cfm?song=1" target="_blank" class="playSong" id="#artist# - #song#">Play Track</a>
Example jQuery:
示例jQuery：
<script type="text/javascript">
$(document).ready(function(){
$(".playSong").click(function(){
var url = $(this).attr('href');
var windowName = $(this).attr('id');
window.open(url, windowName, "height=300,width=400");
});
});
</script>
回答by Spokey
Alternatively use e.preventDefault()or return false
或者使用e.preventDefault()或return false
$(document).ready(function(){
$(".playSong").click(function(e){
e.preventDefault(); // this will prevent the browser to redirect to the href
// if js is disabled nothing should change and the link will work normally
var url = $(this).attr('href');
var windowName = $(this).attr('id');
window.open(url, windowName, "height=300,width=400");
});
});
回答by ServerBloke
Using a data-*attribute would be better than storing song and artist data in the ID.
使用data-*属性比在 ID 中存储歌曲和艺术家数据更好。
<a href="this_page.cfm?song=1" target="_blank" class="playSong" data-info="#artist# - #song#">Play Track</a>
.preventDefault()or return false;can be used to stop the browser from following the link if Javascript is enabled:
.preventDefault()或者return false;可用于阻止浏览器在启用 Javascript 的情况下点击链接：
$(".playSong").click(function(){
var url = $(this).attr('href');
var windowName = $(this).data('info'); // <-- using .data()
window.open(url, windowName, "height=300,width=400");
return false;
});
回答by mplungjan
Here is the actual complete answer to your questions
这是您问题的实际完整答案
How to make the link work in a new window if javascript is disabled or a popup blocker is active
如果 javascript 被禁用或弹出窗口阻止程序处于活动状态，如何使链接在新窗口中工作
$(function(){
$(".playSong").on("click",function(e){
var w = window.open(this.href, this.target, "height=300,width=400");
if (w) e.preventDefault(); // prevent link but only if not blocked
});
});
回答by Prabhuram
You need to give return false upon clicking the link. As follows :
单击链接时，您需要返回 false。如下 ：
$(document).ready(function(){
$(".playSong").click(function(){
var url = $(this).attr('href');
var windowName = $(this).attr('id');
window.open(url, windowName, "height=300,width=400");
return false;
});
});
