jquery cara mengosongkan bidang input


199

Saya di aplikasi seluler dan saya menggunakan bidang input agar pengguna mengirimkan nomor.

Ketika saya kembali dan kembali ke halaman, bidang input menyajikan input nomor terbaru yang ditampilkan di bidang input.

Apakah ada cara untuk menghapus bidang setiap kali memuat halaman?

$('#shares').keyup(function(){
    payment = 0;
    calcTotal();
    gtotal = ($('#shares').val() * 1) + payment;
    gtotal = gtotal.toFixed(2);
    $("p.total").html("Total Payment: <strong>" + gtotal + "</strong>");
});

Jawaban:


418

Anda dapat menghapus bidang input dengan menggunakan $('#shares').val('');


2
Apakah ini berfungsi dan apakah ini memenuhi spesifikasi jika kita memiliki input numerik seperti itu <input type="number" min="0' max="10" value="5"></input>? Saya kira kata berbeda, apakah Anda diizinkan untuk mengatur input numerik menjadi kosong?
Kevin Wheeler

3
Bagaimana dengan .val([])?
Fr0zenFyr

3
Pada catatan terkait, .val([])juga dapat membatalkan pilihan opsi yang dipilih dalam daftar pilih ... tidak begitu banyak dengan .val(''). Hal terbaik tentang itu adalah dukungan lintas-browser. PS: Ini adalah alternatif dari hanya solusi lintas-peramban lain yang efisien - $("select option").prop("selected", false);tetapi berfungsi dengan semua input. Terima kasih kepada Jon untuk tes yang dia buat .
Fr0zenFyr

29
$(document).ready(function(){
  $('#shares').val('');
});

10

Saat mengirimkan formulir, gunakan metode reset pada formulir. Metode reset () mengatur ulang nilai semua elemen dalam formulir.

$('#form-id')[0].reset();

OR 

document.getElementById("form-id").reset();

https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reset

$("#submit-button").on("click", function(){
       //code here
       $('#form-id')[0].reset();
});
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<form id="form-id">
  First name:<br>
  <input type="text" name="firstname">
  <br>
  Last name:<br>
  <input type="text" name="lastname">
  <br><br>
  <input id="submit-button" type="submit" value="Submit">
</form> 
</body>
</html>


Dapat membantu seseorang tetapi dalam konteks ini jawaban Anda tidak berguna.
Marco Concas

8

Pengaturan val('')akan mengosongkan bidang input. Jadi, Anda akan menggunakan ini:

Kosongkan bidang input saat halaman dimuat:

$(function(){
    $('#shares').val('');
});

4

Karena Anda menggunakan jQuery, bagaimana menggunakan trigger- reset :

$(document).ready(function(){
  $('#shares').trigger(':reset');
});

3

Untuk mengatur ulang teks, angka, pencarian, input teks:

$('#shares').val('');

Untuk mengatur ulang pilih:

$('#select-box').prop('selectedIndex',0);

Untuk mengatur ulang input radio:

$('#radio-input').attr('checked',false);

Untuk mengatur ulang input file:

$("#file-input").val(null);

0

jika Anda menekan tombol "kembali" yang biasanya cenderung menempel, yang dapat Anda lakukan adalah ketika formulir dikirimkan membersihkan elemen kemudian sebelum masuk ke halaman berikutnya tetapi setelah melakukan dengan elemen apa yang Anda butuhkan.

    $('#shares').keyup(function(){
                payment = 0;
                calcTotal();
                gtotal = ($('#shares').val() * 1) + payment;
                gtotal = gtotal.toFixed(2);
                $('#shares').val('');
                $("p.total").html("Total Payment: <strong>" + gtotal + "</strong>");
            });
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.