Heim  >  Artikel  >  Web-Frontend  >  Ausführliche Erklärung, wie Sie verhindern können, dass die Seite springt, wenn das Formular in HTML übermittelt wird

Ausführliche Erklärung, wie Sie verhindern können, dass die Seite springt, wenn das Formular in HTML übermittelt wird

黄舟
黄舟Original
2018-05-26 16:32:2321639Durchsuche


1.1 Lösung 1
Formularaktion übermittelt Daten, aber die Seite springt nicht. Sie können Iframe verwenden, um dieses Problem zu lösen.
Beispiel:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Form提交表单页面不跳转</title>
</head>
<body>
    <form action="" method="post" target="myIframe">
        <label for="input_text">账户:</label>
        <input type="text" id="input_text" name="input_text">
        <label for="input_pwd">密码:</label>
        <input type="text" id="input_pwd" name="input_text">
        <input type="submit" id="submit" name="submit" value="提交">
    </form>
    <iframe id="myIframe" name="myIframe"></iframe>
</body>
</html>

Hinweis: Das Zielattribut des Form-Elements muss das Namensattribut des Iframe-Elements sein, das das Rückgabeergebnis angibt.
Iframe-Elemente können an einer beliebigen Stelle im Körper oder in Formularelementen platziert werden.

1.2 Mit Ajax implementiert, keine Aktualisierungstechnologie
Verwenden Sie Javascript, um den Wert des Eingabeelements direkt zu lesen und ihn dann in die Variable in der Funktion einzufügen, damit Ajax ihn verarbeiten kann.
Beispiel – js-Methode serialize oder serializeArray zum Serialisieren von Formulardaten:

<form>  
First name: <input type="text" name="FirstName" value="Bill" /><br />  
Last name: <input type="text" name="LastName" value="Gates" /><br />  
</form>  
<button id="btn">序列化表单值</button>
$("#btn").click(function(){
var x=$("form").serializeArray();  
console.log(x); //执行结果:[{name: "FirstName", value: "Bill" },{name: "LastName",  value: "Gates" }]
var y=$("form").serialize();
console.log(y); //执行结果:FirstName=Bill&LastName=Gates 
});

Hinweis: Die Methode serializeArray() gibt einen JSON zurück Wert, und die Methode serialize() gibt einen Zeichenfolgenwert zurück.

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung, wie Sie verhindern können, dass die Seite springt, wenn das Formular in HTML übermittelt wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn