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

Question

我有一个仅包含一个表单字段的模态，但是，一旦用户输入此值，即使关闭了模态，该模态也会保留。 我希望它在关闭时重置，以便再次打开模态时，窗体为空。 我已经有一些代码，但是它不能正常工作。 如果有人可以帮忙，将不胜感激。

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

Answer 1

这里有几个问题。 您使用的是.myModalViewAddress而不是#myModalViewAddress 。 另外，您还需要使用以下命令清除值：

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

jsFiddle示例

Answer 2

尝试这个：

在onclick动作之后：

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

Answer 3

您的问题是由于您的选择器而给的。

如果您想重置表单元素，可以使用#通过其ID选择表单，然后调用.reset()方法。

而且因为使用了类选择器而没有注册事件. $('.myModalViewAddress')而不是ID选择器# $('#myModalViewAddress')

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