jquery làm thế nào để trống trường đầu vào

199

Tôi đang ở trong một ứng dụng di động và tôi sử dụng trường nhập liệu để người dùng gửi số.

Khi tôi quay lại và trở lại trang mà trường nhập liệu sẽ hiển thị đầu vào số mới nhất được hiển thị ở trường đầu vào.

Có cách nào để xóa trường mỗi lần tải trang không?

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

— kosbou
nguồn

418

Bạn có thể xóa trường nhập bằng cách sử dụng $('#shares').val('');

— shaunantacruz
nguồn

2

Điều này có hoạt động không và nó có tuân thủ thông số kỹ thuật không nếu chúng ta có đầu vào số như vậy <input type="number" min="0' max="10" value="5"></input>? Tôi đoán nói khác đi, bạn có được phép đặt đầu vào số thành trống không?

— Kevin Wheeler

3

Thế còn .val([])?

— Fr0zenFyr

3

Trên một ghi chú liên quan, .val([])cũng có thể bỏ chọn bất kỳ tùy chọn đã chọn nào trong danh sách chọn ... không quá nhiều với .val(''). Điều tốt nhất về nó là nó hỗ trợ nhiều trình duyệt. PS: Đây là một giải pháp thay thế cho chỉ giải pháp trình duyệt chéo hiệu quả khác - $("select option").prop("selected", false);nhưng hoạt động với tất cả các đầu vào. Cảm ơn Jon cho một bài kiểm tra mà anh ấy đã tạo ra .

— Fr0zenFyr

29

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

— osahyoun
nguồn

10

Trong khi gửi biểu mẫu sử dụng phương thức thiết lập lại trên biểu mẫu. Phương thức reset () đặt lại các giá trị của tất cả các phần tử trong một biểu mẫu.

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

OR 

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

https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormEuity/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>

Mở rộng đoạn trích

— Radhika
nguồn

Có thể giúp ai đó nhưng trong bối cảnh này, câu trả lời của bạn là vô ích.

— Marco Concas

8

Cài đặt val('')sẽ làm trống trường đầu vào. Vì vậy, bạn sẽ sử dụng điều này:

Xóa trường nhập khi trang tải:

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

— Đức Phanxicô
nguồn

4

Vì bạn đang sử dụng jQuery, nên sử dụng trình kích hoạt- reset :

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

— Sablefoste
nguồn

3

Để đặt lại văn bản, số, tìm kiếm, nhập liệu văn bản:

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

Để thiết lập lại chọn:

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

Để đặt lại đầu vào radio:

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

Để đặt lại tập tin đầu vào:

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

— những con gà
nguồn

0

Nếu bạn nhấn nút "quay lại", nó thường có xu hướng dính, điều bạn có thể làm là khi biểu mẫu được gửi rõ ràng phần tử sau đó trước khi nó đi đến trang tiếp theo nhưng sau khi thực hiện với phần tử bạn cần.

    $('#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
nguồn