jQuery Bootstrap - 在模态关闭时重置表单值

我有一个只包含一个表单域的模态，但是一旦用户输入该值，即使关闭模态，它也会保留。我想让它在关闭时重置，以便当再次打开模式时，表单是空的。我已经有了一些代码，但它不能正常工作。如果有人可以帮忙，将不胜感激。jQuery Bootstrap - 在模态关闭时重置表单值

HTML /莫代尔：

<!-- Modal --> 
<div id="myModalViewAddress" class="modal fade" role="dialog"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal">×</button> 
       <h4 class="modal-title">View Hidden Information</h4> 
      </div> 
      <div class="modal-body"> 
       <p>Please enter authorisation code</p> 
       <form id="auth_form10"> 
        <div class="form-group has-feedback" name="auth_code10" id="auth_code10"> 
         <input class="form-control" id="auth_code_input10" autocomplete="new-password" name="auth_code_input10" type="password" required> 
         <span class="form-control-feedback glyphicon" id="iconBad10"></span> 
        </div> 
       </form> 
       <hr> 

       <div id="modal-loader" style="display: none; text-align: center;"> 
        <!-- AJAX loader --> 
        <img src="img/ajax-loader.gif"> 
       </div> 

       <div id="dynamic-content-address" class="hidden"> 
        <!-- Dyanamic address --> 
       </div> 

      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      </div> 
     </div> 
    </div> 
</div>

的jQuery：

$('.myModalViewAddress').on('hidden.bs.modal', function() { 
    $(this).find('auth_form10')[0].reset(); 
});

JSFiddle

来源

2017-02-15 sinesine

这里的几个问题。您正在使用.myModalViewAddress而不是#myModalViewAddress。你也需要只是清除值：

$('#myModalViewAddress').on('hidden.bs.modal', function() { 
    $('#auth_form10 input').val(''); 
});

jsFiddle example

来源

2017-02-15 18:38:58 j08691

谢谢，现在的作品完美。当它让我时会接受正确的。 – sinesine

试试这个：

的onclick行动后：

$('#auth_code_input10').val() == null;

来源

2017-02-15 18:39:00 uttejh

您的问题是，因为给你选择。

如果你想重置你的表单元素，你可以使用#来选择你的表单，然后用.reset()方法。

还您事件注册没有被提出，因为你正在使用类选择.$('.myModalViewAddress')而不是id选择#$('#myModalViewAddress')

https://jsfiddle.net/cLkekytx/1/

来源

2017-02-15 18:51:27 andrepaulo

jQuery Bootstrap - 在模态关闭时重置表单值

回答

相关问题