FirefoxでリンクをCtrl＋左クリックしても背面タブで開かなくなるソース [メール投稿]
正己さんはTwitterを使っています: "http://t.co/Yb9uOaeQlmの使用が変わった？ 私はFirefoxでCtrlキーを押しながら左クリックした場合にバックグラウンドで開くようにしてある。他のサイトだと機能するが、http://t.co/Yb9uOaeQlmではバックグラウンドで開かない。なぜ？"
Outlook.com の使用が変わった？ 私はFirefoxでCtrlキーを押しながら左クリックした場合にバックグラウンドで開くようにしてある。他のサイトだと機能するが、Outlook.com ではバックグラウンドで開かない。なぜ？
私のツイートの「使用」は「仕様」の間違い。
次のようなHTMLソースを作ってリンクをCtrl+左クリックして見たら、Outlook.comのテキストメールのリンクをCtrl+左クリックした時と同じ症状を再現できた。
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>
<script>
$('a').on('click',function(){
window.open(this.href);return false;
});
</script>
</body>
</html>
追記（2014/11/20）：<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>
<script>
$('a').on('click',function(){
window.open(this.href);return false;
});
</script>
</body>
</html>
修正ソース。
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<a href="http://www.google.co.jp/" target="test">http://www.google.co.jp/</a>（target="test"）<br />
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>（target="_blank"）<br />
<script>
$('a').on('click',function(){
if(this.target == "_blank"){
window.open(this.href);return false;
};
});
</script>
</body>
</html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<a href="http://www.google.co.jp/" target="test">http://www.google.co.jp/</a>（target="test"）<br />
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>（target="_blank"）<br />
<script>
$('a').on('click',function(){
if(this.target == "_blank"){
window.open(this.href);return false;
};
});
</script>
</body>
</html>
追記（2014/11/21）：
jquery-latest.jsの使用は良くないようなのでソース修正。
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.1.js"></script>
</head>
<body>
<a href="http://www.google.co.jp/" target="test">http://www.google.co.jp/</a>（target="test"）<br />
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>（target="_blank"）<br />
<script>
$('a').on('click',function(){
if(this.target == "_blank"){
window.open(this.href);return false;
};
});
</script>
</body>
</html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.1.js"></script>
</head>
<body>
<a href="http://www.google.co.jp/" target="test">http://www.google.co.jp/</a>（target="test"）<br />
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>（target="_blank"）<br />
<script>
$('a').on('click',function(){
if(this.target == "_blank"){
window.open(this.href);return false;
};
});
</script>
</body>
</html>
追記（2014/11/21）：
Ctrl+左クリック（Firefoxの設定によってはShift+Ctrl+左クリック）で背面タブに開かず、すぐにそのタブに切り替わってしまうリンクのサンプル。
id="test20141121"
http://www.google.co.jp/（target="test"）問題無し
http://www.google.co.jp/（target="_blank"）背面タブで開かない
http://www.google.co.jp/（target="test"）問題無し
http://www.google.co.jp/（target="_blank"）背面タブで開かない
上のリンクのソース
<div>
idなし<br />
<a href="http://www.google.co.jp/" target="test">http://www.google.co.jp/</a>（target="test"）問題無し<br />
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>（target="_blank"）問題無し<br />
</div>
<div id="test20141121">
id="test20141121"<br />
<a href="http://www.google.co.jp/" target="test">http://www.google.co.jp/</a>（target="test"）問題無し<br />
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>（target="_blank"）背面タブで開かない<br />
</div>
<script src="http://code.jquery.com/jquery-2.1.1.js"></script>
<script>
$('#test20141121 a').on('click',function(){
if(this.target == "_blank"){
window.open(this.href);return false;
};
});
</script>
idなし<br />
<a href="http://www.google.co.jp/" target="test">http://www.google.co.jp/</a>（target="test"）問題無し<br />
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>（target="_blank"）問題無し<br />
</div>
<div id="test20141121">
id="test20141121"<br />
<a href="http://www.google.co.jp/" target="test">http://www.google.co.jp/</a>（target="test"）問題無し<br />
<a href="http://www.google.co.jp/" target="_blank">http://www.google.co.jp/</a>（target="_blank"）背面タブで開かない<br />
</div>
<script src="http://code.jquery.com/jquery-2.1.1.js"></script>
<script>
$('#test20141121 a').on('click',function(){
if(this.target == "_blank"){
window.open(this.href);return false;
};
});
</script>
正己 さん
Banner & Logo
コメント 0