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>");
});
jquery input numbers field kosbou
sumber

Jawaban:

418

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

shaunsantacruz
sumber
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('');
});
osahyoun
sumber
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>
Luaskan cuplikan

Radhika
sumber
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('');
});
Francis Lewis
sumber
4

Karena Anda menggunakan jQuery, bagaimana menggunakan trigger- reset :

$(document).ready(function(){
  $('#shares').trigger(':reset');
});
Sablefoste
sumber
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);
ayam
sumber
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>");
            });
chris
sumber