JavaScriptでアンカータグのhref属性を変更するときにページのリロードを防ぐにはどうすればよいですか?

ボタンのクリック時に JavaScript を使用してアンカー タグの href 属性を変更する

Web 開発では、アンカー タグの href 属性を動的に変更する必要があります。アンカー ボタンクリック時のタグが頻繁に発生します。 JavaScript を使用してこれを実現する方法は次のとおりです。

提供されたコード スニペットでは、f1() 関数が ID が「abc」の要素の href 属性を「xyz.php」に変更します。ただし、提供されたコードは期待どおりに機能しません。

デフォルトでは、アンカー タグをクリックするとページのリロードがトリガーされます。これを防ぐには、

<code class="html"><a href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b" onclick="f1()">...jhhghj</a></code>

などの空の href 属性をアンカー タグに追加する必要があります。または、

<code class="html"><a href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b" onclick="f1(); return false;">...jhhghj</a></code>

またはf1() 関数から false を返します:

<code class="javascript">function f1() {
    document.getElementById("abc").href = "xyz.php";          
    return false;
}</code>

...jhhghj

For a more unobtrusive approach, employ an external JavaScript file:

...jhg
...jhhghj

<script></p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">document.getElementById(&quot;myLink&quot;).onclick = function() { document.getElementById(&quot;abc&quot;).href = &quot;xyz.php&quot;; return false; };</pre><div class="contentsignin">ログイン後にコピー</div></div> <p></script>

以上がJavaScriptでアンカータグのhref属性を変更するときにページのリロードを防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。