Bagaimana untuk menggunakan kaedah tetapan semula untuk menetapkan semula kandungan borang dalam jquery

Dalam pembangunan bahagian hadapan, borang ialah elemen penting, dan dalam bentuk, kadangkala perlu mengosongkan atau menetapkan semula kandungan borang. jQuery menyediakan kaedah reset() borang untuk memenuhi keperluan ini.

Apakah kaedah tetapan semula borang jQuery()?

Kaedah tetapan semula borang jQuery() digunakan untuk menetapkan semula kandungan borang. Ia akan menetapkan semula semua input, textarea dan pilih nilai dalam bentuk kepada nilai awalnya.

Sintaks:

Gunakan jQuery:

$(selector).trigger("reset");

Gunakan JavaScript:

document.getElementById("formId").reset();

Penerangan parameter:

• pemilih: Pemilih borang yang akan ditetapkan semula.
• formId: ID borang yang akan ditetapkan semula.

Contoh:

Menggunakan jQuery:

Kod HTML:

<form id="myForm">
    <label for="name">Name:</label>
    <input type="text" name="name" id="name" value="Tom"><br>
    <label for="gender">Gender:</label>
    <select name="gender" id="gender">
        <option value="male">Male</option>
        <option value="female" selected>Female</option>
    </select><br>
    <label for="bio">Bio:</label>
    <textarea name="bio" id="bio">This is my bio.</textarea><br>
    <input type="button" value="Reset" id="resetButton">
</form>

Kod jQuery:

$(document).ready(function(){
    $("#resetButton").click(function(){
        $("#myForm").trigger("reset");
    });
});

Gunakan JavaScript:

Kod HTML:

<form id="myForm">
    <label for="name">Name:</label>
    <input type="text" name="name" id="name" value="Tom"><br>
    <label for="gender">Gender:</label>
    <select name="gender" id="gender">
        <option value="male">Male</option>
        <option value="female" selected>Female</option>
    </select><br>
    <label for="bio">Bio:</label>
    <textarea name="bio" id="bio">This is my bio.</textarea><br>
    <input type="button" value="Reset" id="resetButton" onclick="resetForm()">
</form>

Kod JavaScript:

function resetForm(){
    document.getElementById("myForm").reset();
}

Kesan pencapaian:

Klik butang Set Semula untuk Kosongkan semua kandungan daripada borang.

Nota

• Kaedah jQuery form reset() hanya menetapkan semula semua nilai dalam bentuk kepada nilai lalainya Ia tidak akan mengosongkan mesej ralat borang, begitu juga kosongkan mesej ralat borang Menetapkan semula keadaan fokus kotak input dan kedudukan bar skrol.
• Apabila menggunakan kaedah reset() borang jQuery, jika anda ingin menghalang gelagat penyerahan lalai borang, anda perlu menggunakan kaedah event.preventDefault().
• Jika borang mengandungi butang set semula, anda perlu ambil perhatian bahawa ia akan mengosongkan nilai semua elemen borang Anda boleh menggunakan event.preventDefault() pada acara klik untuk menghalang kelakuan lalai.

Ringkasan

Kaedah jquery form reset() digunakan untuk mengosongkan borang Ia mudah digunakan dan boleh menetapkan semula kandungan borang dengan cepat. Walau bagaimanapun, dalam penggunaan sebenar, kita perlu memberi perhatian kepada beberapa batasan dan langkah berjaga-jaga supaya kita dapat menerapkannya dengan lebih baik untuk memenuhi keperluan kita.

Atas ialah kandungan terperinci Bagaimana untuk menggunakan kaedah tetapan semula untuk menetapkan semula kandungan borang dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!