用modal替换javascript警报

时间:2013-09-11 09:44:14

标签: javascript twitter-bootstrap modal-dialog alerts

如何用模态框替换javascript警报?

根据某些数据库结果,通过回应触发javascript警报

if response is a
{
     <script type="text/javascript">alert("response is a.");</script>
}
else
{
    <script type="text/javascript">alert("response is not a.");</script>
}

我正在使用bootstrap,如果我们可以用bootstrap模态替换警报,那就完美了

2 个答案:

答案 0 :(得分:3)

根据您在以下问题中找到的代码,可以自由地为您创建一个jsbin示例:JavaScript: Overriding alert()

http://jsbin.com/UzUDOno/1/edit

请注意,覆盖警报可能不是一个好主意,特别是因为您将错过常规JavaScript警报的阻止属性。 正如您在我的示例中所看到的,如果您快速连续使用2个警报,则最后一个将覆盖之前的警报。

答案 1 :(得分:0)

只需补充@Kippie。

http://jsbin.com/sadesukuli/2/edit?html,output

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <script type="text/javascript">
    (function() {
  var proxied = window.alert;
  window.alert = function() {
    modal = $('<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button><h3 id="myModalLabel">Modal header</h3></div><div class="modal-body"><p>One fine body…</p></div><div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true">Close</button></div></div>');
    modal.find(".modal-body").text(arguments[0]);
    modal.modal('show');
  };
})();


    alert('moo');
    alert('cow');
  </script>
</body>
</html>

“您的jsbin示例显示了对alert('moo')和alert('cow')的调用”

我的示例同时显示了'moo'和'cow'。