这是打开模式的按钮:
<li><a href="#" class="hvr-bounce-to-right" data-target="#PrctcSched" data-toggle="modal" aria-haspopup="true" aria-expanded="false">Practice Schedule</a></li>
当我点击练习时间表按钮时,背景会逐渐消失,但模式窗口不会显示。
这是模态代码。你能看看我这里的代码出了什么问题吗?
<!-- Modal Practice Schedule Block Begin -->
<div class="modal" id="PrctcSched" tabindex="-1" role="dialog" aria-labelledby="lblPrctcHdr" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal Header -->
<div class="modal-header">
<button type="button" class="close"
data-dismiss="modal">
<span aria-hidden="true">×</span>
<span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="lblPrctcHdr">
My Availability
</h4>
</div>
<!-- Modal Body Block Begin -->
<div class="modal-body">
<form class="form-horizontal" role="form" action="#" method="POST">
<div class="form-group">
<div class="col-sm-10">
<input type="checkbox" class="form-control" name="chbxDt1" Id="chbxDt1" value="chbxDt1chkd" class="col-sm-2 control-label">
<label for="chbxDt1">1</label>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type="checkbox" class="form-control" name="chbxDt2" Id="chbxDt2" value="chbxDt2chkd" class="col-sm-2 control-label">
<label for="chbxDt2">2</label>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type="checkbox" class="form-control" name="chbxDt3" Id="chbxDt3" value="chbxDt3chkd" class="col-sm-2 control-label">
<label for="chbxDt3">3</label>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Update My Availability</button>
</div>
</div>
</form>
<!-- Modal Footer -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal"> Close </button>
</div>
</div>
<!-- Modal Body Block End -->
</div>
</div>
</div>
我只是把你的代码放在我正在处理的页面中,它运行得很好。你可以向它添加"fade"类,以确保模态淡入而不仅仅是出现,但链接为我触发了模态。
<div class="modal fade" id="PrctcSched"...
检查您的引导程序版本,并确保您的文档头中有jquery、bootstrap.js和bootstrap.css。