Link-ul din Formularul HTML/JS [duplicat]

Question 1

Eu sunt în prezent încearcă să facă un program în care să introduceți un link într-un formular HTML și atunci când faceți clic pe un buton se va trimite la acel link. Cu toate acestea, atunci când am faceți clic pe butonul pagina doar sa respinga forma. Eu sunt un Piton nativ și un newbie la HTML/JS așa cum sunt structurarea codul meu poate fi de ce:

<form>
    <input type="url" id="link" placeholder="Enter link of website:" required>
    <br>
    <button class="outline" id="open">Create gate</button>
    </form>
    <script type="text/javascript">
        document.getElementById("open").onclick = () => 
        location.assign(String(document.getElementById("link").value));
    </script> </form>

Question 2

Deoarece, utilizați un formular. Butonul

<button class="outline" id="open">Create gate</button>

acționează ca formă butonul submit și, prin urmare, acesta reîmprospătează pagina înainte de a executa location.assign() metoda. Există multe modalități de a remedia acest lucru.

Un mod simplu este de a exclusiv spun browser-ul pe care acest buton nu este butonul submit, putem face asta prin utilizarea type="button" atribut în butonul nostru.

Crea poarta
Puteți utiliza e.preventDefault() pe formularul prezinte pentru a opri răcoritoare de pe pagina.

Incearca codul de mai jos:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Location Object</title>
</head>
<body>
    <form>
        <input type="url" id="link" placeholder="Enter link of website:" required>
        <br>
        <button class="outline" id="open">Create gate</button>
    </form>
    <script type="text/javascript">
        document.getElementById("open").addEventListener('click', (e) => {
             e.preventDefault();
            location.assign(String(document.getElementById("link").value));
        });
       
    </script>
    </form>
</body>
</html>

Question 3

Codul tău, exact așa cum este prevăzut, lipite într-un minim HTML5 boilerplate șablon, funcționează în Textastic editor de cod și în Safari ruleaza pe localhost.

Poate că unele alte JavaScript în apropiere de ascultător eveniment este de rupere săgeata funcție. Poate bracketing cel funcția de declarație ar putea ajuta?

Imran Rafiq Rather · Answer 1 · 2021-11-24T05:52:15

Deoarece, utilizați un formular. Butonul

<button class="outline" id="open">Create gate</button>

acționează ca formă butonul submit și, prin urmare, acesta reîmprospătează pagina înainte de a executa location.assign() metoda. Există multe modalități de a remedia acest lucru.

Un mod simplu este de a exclusiv spun browser-ul pe care acest buton nu este butonul submit, putem face asta prin utilizarea type="button" atribut în butonul nostru.

Crea poarta
Puteți utiliza e.preventDefault() pe formularul prezinte pentru a opri răcoritoare de pe pagina.

Incearca codul de mai jos:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Location Object</title>
</head>
<body>
    <form>
        <input type="url" id="link" placeholder="Enter link of website:" required>
        <br>
        <button class="outline" id="open">Create gate</button>
    </form>
    <script type="text/javascript">
        document.getElementById("open").addEventListener('click', (e) => {
             e.preventDefault();
            location.assign(String(document.getElementById("link").value));
        });
       
    </script>
    </form>
</body>
</html>

Scott Wright · Answer 2 · 2021-11-24T05:48:39

Codul tău, exact așa cum este prevăzut, lipite într-un minim HTML5 boilerplate șablon, funcționează în Textastic editor de cod și în Safari ruleaza pe localhost.

Poate că unele alte JavaScript în apropiere de ascultător eveniment este de rupere săgeata funcție. Poate bracketing cel funcția de declarație ar putea ajuta?

Link-ul din Formularul HTML/JS [duplicat]

Problema

Cel mai bun răspuns

În alte limbi

Această pagină este în alte limbi

Popular în această categorie

Întrebări frecvente în această categorie