C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

ログ内検索
  • キーワードを複数指定する場合は 半角スペース で区切ってください。
  • 検索条件は、(AND)=[A かつ B] (OR)=[A または B] となっています。
  • [返信]をクリックすると返信ページへ移動します。
キーワード/ 検索条件 /
検索範囲/ 強調表示/ ON (自動リンクOFF)
結果表示件数/ 記事No検索/ ON
大文字と小文字を区別する

No.102031 の関連記事表示

<< 0 >>
■102031  別タブで開くaタグのリンクについて
□投稿者/ nabeya -(2023/06/09(Fri) 10:30:45)

    分類:[HTML/CSS] 

    2023/06/09(Fri) 10:32:39 編集(投稿者)

    作成したWebページに以下のようなaタグを用意し、リンクを別タブで開くようにしています。
    (迷惑投稿と判断されるため、タグ開始終了文字は全角にしています)

    <a href="https://hogehoge.jp/hogehoge/)" target="hoge" rel="noreferrer">ここをクリック!</a>

    ただ、このリンクを複数回クリックすると、その都度新しいタブが開いてしまいます。
    (確認したブラウザはWindows10上のChrome)

    このaタグのリンクをクリックした場合に生成されるタブは唯一にすることは可能でしょうか?
    JavaScriptを使う必要があれば、その方法も教えて頂けると幸いです。
親記事 /過去ログ178より / 関連記事表示
削除チェック/

■102034  Re[1]: 別タブで開くaタグのリンクについて
□投稿者/ WebSurfer -(2023/06/09(Fri) 12:00:24)
    No102031 (nabeya さん) に返信

    > <a href="https://hogehoge.jp/hogehoge/)" target="hoge" rel="noreferrer">ここをクリック!</a>
    >
    > ただ、このリンクを複数回クリックすると、その都度新しいタブが開いてしまいます。

    rel="noreferrer" を設定しているからでしょう。削除すれば、やりたいこと、

    > このaタグのリンクをクリックした場合に生成されるタブは唯一にする

    はできるはずです。


    参考:

    HTML 属性: rel
    https://developer.mozilla.org/ja/docs/Web/HTML/Attributes/rel

    "noreferrer Referer ヘッダーを含めません。さらに、 noopener と同じ効果
    もあります"

    rel=noopener
    https://developer.mozilla.org/ja/docs/Web/HTML/Attributes/rel/noopener

    "noopener を使用した場合、ターゲット名に _top, _self, _parent 以外の
    空でない名前を使用すると、新しいウィンドウやタブを開くかどうかの判断
    において、すべて _blank と同様に扱われます"
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/

■102036  Re[2]: 別タブで開くaタグのリンクについて
□投稿者/ nabeya -(2023/06/09(Fri) 12:52:35)
    rel="noreferrer"をつけていると、そのリンク用の唯一タブは出来ないんですね。
    rel="noreferrer"をつけているのはリンク元を見せたくない
    (見られてマズいものはないが、恥ずかしい)ためなので、
    その都度リンク先のタブが増えるのは仕方がないものとして諦めます。
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/

■102038  Re[3]: 別タブで開くaタグのリンクについて
□投稿者/ WebSurfer -(2023/06/09(Fri) 13:58:13)
    No102036 (nabeya さん) に返信

    > その都度リンク先のタブが増えるのは仕方がないものとして諦めます。

    諦めてこの話は終わりにするなら「解決済み」マークをつけてこのスレッドは
    クローズしてください。

    しばらく他の方からの回答を待ちたいということであれば、その限りではあり
    ませんが。
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/

■102042  Re[4]: 別タブで開くaタグのリンクについて
□投稿者/ nabeya -(2023/06/11(Sun) 12:05:37)
    > 諦めてこの話は終わりにするなら「解決済み」マークをつけてこのスレッドは
    > クローズしてください。

    同様の質問が無いかを調べていた時に過去の書き込みを見ましたが、
    解決していないのに、「解決済み」にチェックをすべきではない、
    と発言した人ですよね?
    今回の質問に関しては、諦めたけど、解決はしていないので、そのようにしています。
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/

■102043  Re[5]: 別タブで開くaタグのリンクについて
□投稿者/ WebSurfer -(2023/06/11(Sun) 12:46:15)
    No102042 (nabeya さん) に返信

    > 解決していないのに、「解決済み」にチェックをすべきではない、
    > と発言した人ですよね?

    どのスレッドのことを言っているのですか? Q&A を続ければ解決できる可能性がある
    のに止めて解決済みマークをつけて終わりにしたという話だったのでは。

    > 今回の質問に関しては、諦めたけど、解決はしていないので、そのようにしています。

    今回の場合は、回答で解決できないことが分った ⇒ なので諦めた ⇒ これ以上 Q&A は
    不用ということだと理解してます。違いますか?

    であれば、「解決できないことが分った」ことで解決と言うことで良いと思いますけど。
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/

■102044  Re[6]: 別タブで開くaタグのリンクについて
□投稿者/ くま -(2023/06/11(Sun) 23:17:48)
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/

■102045  Re[7]: 別タブで開くaタグのリンクについて
□投稿者/ くま -(2023/06/12(Mon) 01:11:55)
    2023/06/12(Mon) 01:50:24 編集(投稿者)

    失礼noreferrerをしたいんでしたね

    それなら先のサンプルを一部修正
    ここを
    //windowObjectReference = window.open(url, windowName);
    この様に空のタブを開いてから移動するように変更
    windowObjectReference = window.open('', windowName);
    windowObjectReference.document.body.innerHTML = '<a id="reload" href="' + url + '" rel="noreferrer"></a>';
    windowObjectReference.document.getElementById("reload").click();

    ※投稿エラーになるので半角<>は全角<>になっています。

    またはこちら
    windowObjectReference = window.open('', windowName);
    let elem = windowObjectReference.document.createElement('a');
    elem.href = url;
    elem.rel = "noreferrer";
    windowObjectReference.document.body.appendChild(elem);
    elem.click();
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/

■102046  Re[8]: 別タブで開くaタグのリンクについて
□投稿者/ ???? -(2023/06/12(Mon) 01:38:22)
    2023/06/12(Mon) 01:39:49 編集(投稿者)

    ※送信ミスの為削除
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/

■102050  Re[8]: 別タブで開くaタグのリンクについて
□投稿者/ WebSurfer -(2023/06/12(Mon) 15:51:01)
    No102045 (くま さん) に返信
    
    > またはこちら
    >     windowObjectReference = window.open('', windowName);
    > 	let elem = windowObjectReference.document.createElement('a');
    > 	elem.href = url;
    > 	elem.rel = "noreferrer";
    > 	windowObjectReference.document.body.appendChild(elem);
    > 	elem.click();
    > 
    
    なるほど、それで複数 a タグをクリックしても同じ window で表示されて要求ヘッダに Refer
    は含まれなくなりますね。
    
    それを MDN の記事、
    
    Window.open()
    https://developer.mozilla.org/ja/docs/Web/API/Window/open
    
    の「既存のウィンドウを再利用して target="_blank" を防止する」のセクションにある
    サンプルコードに組み込んで、同じ a タグを続けてクリックしても要求が出ないように
    するのが良さそうです。
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <script type="text/javascript">
            let windowObjectReference = null; // global variable
            let previousURL; /* global variable that will store the
                        url currently in the secondary window */
    
            function openRequestedSingleTab(url) {
                if (windowObjectReference === null || windowObjectReference.closed) {
                    let a = document.createElement("a");
                    a.href = url;
                    a.rel = "noreferrer";
                    windowObjectReference = window.open('', 'SingleSecondaryWindowName');
                    windowObjectReference.document.body.appendChild(a);
                    a.click();
                } else if (previousURL !== url) {
                    let a = document.createElement("a");
                    a.href = url;
                    a.rel = "noreferrer";
                    windowObjectReference = window.open('', 'SingleSecondaryWindowName');
                    windowObjectReference.document.body.appendChild(a);
                    a.click();
                    /* if the resource to load is different,
                       then we load it in the already opened secondary window and then
                       we bring such window back on top/in front of its parent window. */
                    windowObjectReference.focus();
                } else {
                    windowObjectReference.focus();
                }
                previousURL = url;
                /* explanation: we store the current url in order to compare url
                   in the event of another call of this function. */
            }
    
            window.addEventListener('DOMContentLoaded', () => {
                const links = document.querySelectorAll("a[target='SingleSecondaryWindowName']");
    
                for (const link of links) {
                    link.addEventListener(
                        "click",
                        (event) => {
                            openRequestedSingleTab(link.href);
                            event.preventDefault();
                        },
                        false
                    );
                }
            });
        </script>
    </head>
    <body>
        <a href="default" target="SingleSecondaryWindowName" rel="noreferrer">Default</a>
        <br />
        <a href="about" target="SingleSecondaryWindowName" rel="noreferrer">About</a>
        <br />
        <a href="contact" target="SingleSecondaryWindowName" rel="noreferrer">Contact</a>
    </body>
    </html>
記事No.102031 のレス /過去ログ178より / 関連記事表示
削除チェック/



<< 0 >>

パスワード/

- Child Tree -