无法从模式内的链接打开另一个页面

时间:2015-07-05 22:37:53

标签: html twitter-bootstrap

我正在尝试使用bootstrap模式中的按钮链接到我网站上的另一个页面。由于某种原因,我无法做到这一点。以下是模态中的代码:

<div class="modal-footer">
    <a href="another-page.php" data-dismiss="modal" class="btn btn-success">Read More</a>
    <button type="button" data-dismiss="modal" class="btn btn-warning">Close</button>
</div><!-- End modal-footer -->

单击“阅读更多”按钮将关闭模式,但不会打开指向another-page.php的链接。还有另外一个我错过的标签吗?

2 个答案:

答案 0 :(得分:1)

在链接

中使用此命令代替data-dismiss="modal"
onclick="$('#modalId').modal('hide')"

答案 1 :(得分:0)

从按钮中删除data-dismiss="modal"属性...

<div class="modal-footer">
    <a href="another-page.php" class="btn btn-success">Read More</a>
    <button type="button" data-dismiss="modal" class="btn btn-warning">Close</button>
</div><!-- End modal-footer -->

示例...

&#13;
&#13;
$('#openBtn').click(function(){
	$('#myModal').modal({show:true})
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>


<a href="#" class="btn btn-default" id="openBtn">Open modal</a>

<div id="myModal" class="modal fade" tabindex="-1" role="dialog">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">×</button>
				<h3>Modal header</h3>
			</div>
			<div class="modal-body">
				<p>My modal content here…</p>
			</div>
			<div class="modal-footer">
				<a href="http://example.com" class="btn btn-success">Read More</a>
				<button class="btn" data-dismiss="modal">Close</button>
			</div>
		</div>
	</div>
</div>
&#13;
&#13;
&#13;