清除按鈕單擊時輸入的文本框

Question

我確實有多個名為“名字，姓氏，電話號碼”的文本框，等等。我想清除/刷新在按鈕單擊時鍵入的輸入，稱為“刷新”或“ clear。”。問題是這些文本中的輸入框未刷新，因為其中的數據來自其他頁面，並且當我們在其中鍵入某些內容時，其刷新的代碼如下：

<div class="control-group">
        <input value="<?php echo $model['pros']['oppid'] ?>" name="oppid" type="hidden" id="prospectid"  />
        <label class="control-label">First Name  </label>
        <div class="controls">
            <input type="text" name="f_name" pattern="[-a-zA-Z]+" required="" title="First Name is required" value="<?php echo $model['pros']["f_name"]; ?>"  />
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">Last Name </label>
        <div class="controls">
            <input type="text" name="l_name" pattern="[-a-zA-Z]+" required="" title="Last Name is required"  value="<?php echo $model['pros']["l_name"];?>"  />
        </div>
    </div>
<div class="control-group">
        <label class="control-label">Primary phone  </label>
        <div class="controls">
<input type="tel" required="" pattern="[-0-9]+" title="Please Enter correct phone" name="pri_phone" value="<?php echo $model['pros']["pri_phone"];?>"  />
        </div>
    </div>

和按鈕為

<button class="btn">New</button>

請在這方面建議我...

Answer 1

假設您的input元素都在表單內，並且按鈕也是如此，則可以使用jQuery來做到這一點：

$('button.btn').click(function(e) {
    e.preventDefault();  
    $(this).parents('form').find('input[type="text"], input[type="tel"]').val('');
});

Answer 2

使用以下代碼：

$("#elementid").live('click',function(){
     $(this).parents('form').find('input[type="text"]').val('');
});

Answer 3

您可以在jquery中將代碼編寫為：

$('#new').live('click',function(){
   $('#fname').val('');
   $('#lname').val('');
   $('#tel').val('');
});

Answer 4

如果您的按鈕不在表單中，則可以使用以下命令

$('button.btn').click(function() {
   $('.control-group input:not(:submit)').val('');
});

這將重置control-group div中的任何類型的輸入，但提交輸入除外

如果您的重置按鈕的形式內，則BenM的答案是你想要的。

Answer 5

$(".clearform").live('click',function(){
     $(this).parents('form').find('input[type="text"], input[type="tel"],input[type="time"],input[type="email"],input[type="number"],input[type="date"],select').val('');
});