当我关闭引导模式时,模式会再次打开,然后隐藏,背景保持变暗。我正在点击表 tr 打开模式。我也尝试强制模式隐藏,但没有成功。请任何帮助都会起作用。
<tr class="task-row task-row-{{$v_task->id}}" data-id="{{$v_task->id}}" data-target="#editTaskModal-{{$v_task->id}}">
<div id="editTaskModal-{{$v_task->id}}" class="modal fade editTaskModal" role="dialog" data-id="{{$v_task->id}}">
<input type="hidden" name="_method" value="put">
<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">{{$v_task->task_name}}</h4>
</div>
<div class="modal-body">
<div class="form-group">
<div class="row">
<label for="listNameInput" class="col-sm-2">Name:</label>
<div class="col-sm-10">
<input type="text" name="taskNameName" class="form-control" placeholder="Your task name..." id="taskNameInput-{{$v_task->id}}">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<label for="listPriorityInput" class="col-sm-2">Priority:</label>
<div class="col-sm-10">
<input type="text" name="taskNamePriority" class="form-control" placeholder="Your priority..." id="taskPriorityInput-{{$v_task->id}}">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<label for="listDeadlineInput" class="col-sm-2">Deadline:</label>
<div class="col-sm-10">
<div class="input-group datetimepicker2">
<input type="datetime" name="taskNameDeadline" class="form-control deadlineInput" placeholder="Deadline..." id="taskDeadlineInput-{{$v_task->id}}">
<div class="input-group-addon calendar-div">
<span class="fa fa-calendar-o"></span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-success updateTaskModalBtn" data-dismiss="modal">Update</button> or
<a data-dismiss="modal" href="" class="closeTaskModalLink"> Close</a>
</div>
</div>
</div>
</div>
最佳答案
您似乎有一个 onclick 事件,当单击 close
链接以关闭模式时会触发该事件。
引用此:
<a data-dismiss="modal" href="" class="closeTaskModalLink"> Close</a>
没有必要这样做,因为有一个属性可以关闭模式。
所以我建议更改上面的代码并执行下面的操作,看看它是如何工作的。
<a data-dismiss="modal">Close</a>
更新
好的,我看到你的 JS 代码了:
$('.editTaskModal').on('hidden.bs.modal', function () {
$('.editTaskModal').modal('hide');
$('body').removeClass('modal-open');
$('.modal-backdrop').remove();
})
您不应该包含这些,因为它会做的是,如果模式关闭/隐藏,它将再次隐藏模式。这是没有意义的,因为模式已经很接近了。这可能就是它扰乱模式显示/隐藏的原因。
所以删除它,看看会发生什么。
关于javascript - 关闭一个后重新打开模式,laravel,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41880391/