Question

我需要一个重置按钮的帮助，该按钮将清除用户选择或输入的所有值。我的代码示例如下。我之前使用过JS来重置表单中的所有值，但在这种情况下我只需要清除表单的一部分。我的代码如下：所以每个Fieldset都有文本框或下拉列表。

 <div class="column">
                        <p class="label item-information-fields">New Item</p>

                        <div class="item-information-fields">
<fieldset class="input-section">
    <label for="tItemNickname"><span class="required">*</span>Item Name</label>
    <input type="text" class="input" name="tItemNickname" id="tItemNickname" maxlength="15" />
</fieldset>

<fieldset class="input-section">
    <label for="sItemType"><span class="required">*</span>Item Type</label>
    <select name="sItemType" id="sItemType">
        <option value="">Select</option>
        <option value="1">Cash/Certificate</option>
        <option value="2">Jewelry</option>
        <option value="3">Clothing/Home Products</option>
        <option value="4">Arts/Crafts</option>
        <option value="5">Media, Music/Video</option>
        <option value="6">Electronics</option>
        <option value="7">Computers</option>
        <option value="8">Collectibles</option>
        <option value="9">Sports Equipment</option>
        <option value="10">Liquor/Wine</option>
        <option value="11">Animals</option>
        <option value="12">Document Reconstruction</option>
        <option value="13">Firearm</option>
        <option value="14">Hazardous Material</option>
        <option value="16">Event Tickets</option>
        <option value="15">Other</option>
    </select>
</fieldset>

    <fieldset class="input-section hide" id="otherItemType">
    <label for="tOtherItem"><span class="required">*</span>Other Item Type</label>
    <input type="text" class="input" name="tOtherItem" id="tOtherItem" maxlength="15" />
</fieldset>

<fieldset class="input-section">
    <label for="tItemDescription"><span class="required">*</span>Item Description</label>
    <textarea class="textarea counter" name="tItemDescription" id="tItemDescription" maxlength="120"></textarea>
</fieldset>

<fieldset class="input-section input-section-short">
    <label for="tPurchaseDate"><span class="required">*</span>Purchase Date (mm/dd/yyyy)</label>
    <input class="input hasDatePicker enable-sundays" name="tPurchaseDate" id="tPurchaseDate" type="text" />
</fieldset>
<p class="note">If there was no purchase date, use the date the item was shipped.</p>

<fieldset class="input-section borders">
    <label for="tAmountRequested"><span class="required">*</span>Amount Requested</label>
    <span class="dollarWrap">
        <span class="input-dollar-sign">$</span>
        <input class="input" name="tAmountRequested" id="tAmountRequested" type="text" />
    </span>
</fieldset>

//按钮清除表单。

<input type="reset" value="Reset" />

Answer 1

或类似的东西：

$(function(){
   $("#ClearItems").click(function(){
    $("#myForm")[0].reset();
  });
});

如何使用重置按钮清除用户选择的值

1 个答案:

工作小提琴：http://jsfiddle.net/oqcqwyy4/