如何隐藏模态?

Question

我已经卡了将近一天，但仍然无法解决这个问题。我已经在网络上搜索，使用此代码的常见建议$('#Modal').modal('hide').这在我的其他使用模态的函数中工作，但有一个特定的函数无法关闭。这是我能够关闭模态的示例。

$(document).on('click', '#btnProcedureAccessSave', function (event) {
HideAllInModal();
$('#divLoadingInModal').show();
$.ajax({
async: false,
type: 'POST',
url: '/admin/AddProcedureAccess',
data: {
UserID: $('#txtNewUserID').val(),
ProcedureID: $('#txtSelectedProcedureID').val(),
__RequestVerificationToken: gettoken(),
},
success: function (response) {
if (response['success'] == true) {
$('#Modal').modal('hide');
ProcedureAccessMarkUpUpdate(response['data']);
}
else {
$('#divLoadingInModal').hide();
$('#divProcedureAccessInModal').show();
ValidationError(response['error']);
}
},
error: function (jqXHR, exception) {
$('#divLoadingInModal').hide();
$('#divProcedureAccessInModal').show();
JavaScriptError(jqXHR, exception);
}
});
});

这里是我无法关闭模态的代码

function DeleteUserProcedureAccess(ID) {
HideAllInModal();
$('#divLoadingInModal').show();
$.ajax({
async: false,
type: 'POST',
url: '/admin/DeleteUserProcedureAccess',
data: {
UserProcedureID: ID,
__RequestVerificationToken: gettoken()
},
success: function () {
$('#' + ID).remove();
$('#Modal').modal('hide');
},
error: function (jqXHR, exception) {
$('#Modal').modal('hide');
JavaScriptError(jqXHR, exception);
}
});
}

我的网页代码

<div class="modal fade show" tabindex="-1" role="dialog" id="Modal" style="padding-right: 17px;" aria-modal="true">
@*Loading Modal*@
<div id="divLoadingInModal" class="modal-dialog modal-md modal-dialog-centered" role="document" style="display:none; width:110px;">
<div class="modal-content" style="text-align:center">
<img src="~/Content/Assets/img/5.gif"  style="width:100px; height:100px; margin:5px;"/>
<h5>Loading...</h5>
</div>
</div>
@*Procedure Access Modal*@
<div id="divProcedureAccessInModal" class="modal-dialog modal-md modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"><label id="lblProcedureAccessModalHeader"></label></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body needs-validation">
<input id="txtProcedureAccessID" type="hidden" />
<div class="form-Group">
<label>Name</label>
<input id="txtNewUserID" type="hidden" />
<div class="input-group">
<input id="txtProcedureAccessname" type="text" class="form-control form-control-sm" />
</div>
<label id="err_ProcedureAccessUserID"></label>
</div>
<div class="modal-footer bg-whitesmoke">           
<button class="btn btn-primary btn-shadow" id="btnProcedureAccessSave">Save</button>
</div>
</div>
</div>
</div>
</div>

Answer 1

你需要找到模态div的正确ID 例如，如果您使用此 $('#Modal'(.modal('hide'(;这意味着您的模态 ID 是"模态"。您正在使用正确的方法来隐藏模型，但您的 jQuery 选择器是错误的 ID。 使用正确的 jQuery 选择器 ID，例如，如果您的模态在显示它时您正在调用 - $('#divLoadingInModal'(.show((;同样的笏隐藏你需要打电话 $('#divLoadingInModal'(.hide((;或 $('#divLoadingInModal'(.modal('hide'(; 确保您在 $ 函数中使用了正确的 jquery 选择器。

Answer 2

您可能正在模态中使用 fade 类，这将禁用隐藏选项。摆脱该类，其他原因是模态的重复 id，您可以尝试测试是否识别 id。另一个原因是引导程序版本 新方式

老路