9

まず第一に、私は本当の問題を抱えていません。私は好奇心からこれを求めています。

このように、同じリンク内で とを使用するjavascript:void(0)と、誤って奇妙な動作に遭遇します。target="_blank"

<a href="javascript:void(0);" target="_blank" /> Link </a>

これは正常に処理され、リンクをChromeクリックしても何もしないことがわかりましたが、空白の新しいタブが開きます。IEFirefox

私の質問は、javascript:void(0)新しいタブ/ウィンドウを対象としている場合でも、リンクからのクリック イベントの発生を防ぐことは想定されていませんか? そして、なぜそれをtarget="_blank"上書きするのですか？

また、たとえば、属性にバックエンド言語を入力していて、属性の横にハードコードするhrefことを好む場合、最善のアプローチは何ですか?target="_blank"href

4

2 に答える 2

1

簡単なトリックを使用してこれを解決しました。役に立つかもしれません。

リンクに基づいてターゲット属性を動的に削除しました。つまり、リンクが未定義、空、または javascript:void(0) の場合、以下のコードを使用してターゲット属性を削除します。

リンクが適切なものである場合、そのハイパーリンクのターゲット属性を追加します（私のページではリンクが動的であるため、「2番目のif条件」がそれを行います）。

サンプルの html ファイル (Test.html) をコピーしました。ページのオンロード時に属性を削除する場合は、このファイルのスクリプト コードをコピーし、必要なファイルの末尾に貼り付けます。

これを動的リンクに適用する場合は、このコードを 1 つの関数に入れる必要があり、必要なときに呼び出すことができます。

このコードは、そのページ内のすべてのハイパー リンクに適用されます。クラスまたはその他の属性を使用して、これを特定のリンクのセットに制限できます。

Test.html
---------

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<a href="javascript:void(0);" target="_blank">Link1</a>
<a href="javascript:void(0);" target="_blank">Link2</a>
<a href="www.url1.com" target="_blank">Link3</a>
<a href="www.url2.com" target="_blank">Link4</a>

<script>
$("a").each(function() {

if(typeof(this.href) == 'undefined' || this.href == 'javascript:void(0);') {
    $(this).attr('href', 'javascript:void(0);');
    $(this).removeAttr('target');
}
if(typeof(this.href) != 'undefined' && this.href != 'javascript:void(0);') {
    var s_link = this.href;
    if (s_link.indexOf('http://') === -1 && s_link.indexOf('https://') === -1) {
        s_link = 'https://' + s_link;
    }   
    $(this).attr('href', s_link);
    $(this).attr('target', '_blank');
}

});
</script>
于 2016-11-03T06:54:21.237 に答える