jquery วิธีการล้างฟิลด์อินพุต

200

ฉันอยู่ในแอพมือถือและฉันใช้ฟิลด์อินพุตเพื่อให้ผู้ใช้ส่งหมายเลข

เมื่อฉันย้อนกลับไปและกลับไปยังหน้านั้นช่องป้อนข้อมูลนำเสนอการป้อนหมายเลขล่าสุดที่แสดงที่ช่องป้อนข้อมูล

มีวิธีใดบ้างในการล้างข้อมูลทุกครั้งที่โหลดหน้าเว็บ

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

— kosbou
แหล่งที่มา

419

คุณสามารถล้างฟิลด์อินพุตโดยใช้ $('#shares').val('');

— shaunsantacruz
แหล่งที่มา

2

การทำงานนี้และมันเป็นสเปคที่สอดคล้องกับถ้าเรามีการป้อนข้อมูลที่เป็นตัวเลขเช่นดังนั้น<input type="number" min="0' max="10" value="5"></input>? ฉันเดาว่าต่างกันคุณได้รับอนุญาตให้ตั้งค่าตัวเลขให้เป็นค่าว่างหรือไม่?

— Kevin Wheeler

3

แล้วไง.val([])ล่ะ

— Fr0zenFyr

3

ในบันทึกที่เกี่ยวข้อง, .val([])นอกจากนี้ยังสามารถยกเลิกการเลือกตัวเลือกที่เลือกใด ๆ ในรายการเลือก ... .val('')ไม่มากด้วย สิ่งที่ดีที่สุดเกี่ยวกับมันคือการรองรับข้ามเบราว์เซอร์ PS:นี่เป็นทางเลือกสำหรับโซลูชันข้ามเบราว์เซอร์ที่มีประสิทธิภาพอื่น ๆ เท่านั้น$("select option").prop("selected", false);แต่ทำงานได้กับอินพุตทั้งหมด ขอขอบคุณที่จอนสำหรับการทดสอบที่เขาสร้างขึ้น

— Fr0zenFyr

29

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

— osahyoun
แหล่งที่มา

10

ในขณะที่ส่งแบบฟอร์มใช้วิธีการรีเซ็ตในแบบฟอร์ม การรีเซ็ต () วิธีการรีเซ็ตค่าขององค์ประกอบทั้งหมดในรูปแบบ

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

ขยายตัวอย่างข้อมูล

— Radhika
แหล่งที่มา

สามารถช่วยเหลือใครบางคน แต่ในบริบทนี้คำตอบของคุณไม่มีประโยชน์

— Marco Concas

8

การตั้งค่าval('')จะทำให้ฟิลด์อินพุตว่าง ดังนั้นคุณจะใช้สิ่งนี้:

เคลียร์ฟิลด์อินพุตเมื่อโหลดเพจ:

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

— ฟรานซิสเลวิส
แหล่งที่มา

4

เนื่องจากคุณใช้ jQuery คุณจะใช้ทริกเกอร์รีเซ็ตได้อย่างไร :

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

— Sablefoste
แหล่งที่มา

3

ในการรีเซ็ตข้อความ, ตัวเลข, ค้นหา, อินพุตข้อความ textarea:

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

หากต้องการรีเซ็ตให้เลือก:

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

วิธีรีเซ็ตอินพุตวิทยุ:

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

ในการรีเซ็ตไฟล์อินพุต:

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

— ไก่
แหล่งที่มา

0

หากคุณกดปุ่ม "ย้อนกลับ" มันมักจะติดสิ่งที่คุณสามารถทำได้คือเมื่อแบบฟอร์มถูกส่งล้างองค์ประกอบแล้วก่อนที่มันจะไปที่หน้าถัดไป แต่หลังจากทำกับองค์ประกอบสิ่งที่คุณต้องการ

    $('#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>");
            });

— คริส
แหล่งที่มา