Comment empêcher le rechargement de page lors de la modification de l'attribut href de la balise d'ancrage avec JavaScript ?

Modification de l'attribut href d'une balise d'ancrage à l'aide de JavaScript lors d'un clic sur un bouton

Dans le développement Web, la nécessité de modifier dynamiquement l'attribut href de une ancre la balise sur le bouton, le clic se produit fréquemment. Voici comment y parvenir en utilisant JavaScript.

Dans l'extrait de code fourni, la fonction f1() modifie l'attribut href d'un élément avec l'ID « abc » en « xyz.php ». Cependant, le code fourni ne fonctionnera pas comme prévu.

Par défaut, cliquer sur une balise d'ancrage déclenche un rechargement de la page. Pour éviter cela, vous devez ajouter un attribut href vide à la balise d'ancrage, tel que :

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

Vous pouvez également empêcher le défilement de la page en utilisant :

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

ou renvoie false de la fonction f1() :

<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">Copier après la connexion</div></div> <p></script>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!