关闭时清除表单输入字段 - Clear form input field on toggle off

Clear form input field on toggle off

本文关键字：输入字段表单清除 | 更新日期: 2023-09-27

我有一个表单，如果用户更改他/她的选择，我希望清除一个可选字段。我得到了添加或删除可选选项的表单，但是如果用户在可选字段中键入文本，然后改变主意并点击取消按钮，那么我希望清除可选字段中的值。我需要这个，因为在提交表单时，如果可选字段中没有新日期要提交到数据库，则可选字段为空很重要。

    <form>
      <a href="#" class="show_hide">+ Add New</a>
      <div class="slidingDiv">
        Artists name: <input type="text" name="name">
        Artists info: <textarea name="info" cols="65" rows="15"></textarea>  
        <a href="#" class="show_hide">Cancel</a>
      </div>
    </form>

$(document).ready(function(){
    $(".slidingDiv").hide();
    $(".show_hide").show();
$('.show_hide').click(function(){
$(".slidingDiv").slideToggle();
});

}）;

$('.show_hide').click(function(){
    $(".slidingDiv").slideToggle();
    $(".slidingDiv input").val("");
    $(".slidingDiv textarea").val("");
    $(".slidingDiv textarea").html("")
});

这会将字段的值更改为 " 或空白。

注意：Textarea 在那里有两次，因为我相信有些浏览器不会将文本区域的内容记录为value，而是记录为innerHTML。

编辑：如果要清除特定字段，请在HTML中为该字段分配id，然后使用jQuery清除其值。

例如：

<input type="text" name="customerName" id="myInputField" />
<textarea name="customerResponse" id="myTextarea" /></textarea>

。然后是你的jQuery：

$("#myInputField").val("");
$("#myTextarea").val("");

因此，如果您.slidingDiv input id"myInputField"，并且您只想清除输入而不是文本区域，那么您的jQuery将如下所示：

$('.show_hide').click(function(){
    $(".slidingDiv").slideToggle();
    $("#myInputField").val("");
});

这是非常，非常，非常基本的jQuery，所以在来StackOverflow寻求帮助之前，请务必浏览一些教程！