通过JavaScript动态创建Bootstrap警报框 [英] Dynamically create Bootstrap alerts box through JavaScript

问题描述

我正在为我的项目使用Bootstrap 2.0，我想在我的页面中动态添加Bootstrap警告框（ http://twitter.github.com/bootstrap/javascript.html#alerts ）。我想做类似的事情：

I'm using Bootstrap 2.0 for my project and I would like to dynamically add Bootstrap alert box in my page (http://twitter.github.com/bootstrap/javascript.html#alerts). I want to do something like:

bootstrap-alert.warning("Invalid Credentials"); 

推荐答案

试试这个（请参阅此代码的工作示例） jsfiddle： http://jsfiddle.net/periklis/7ATLS/1/ ）

Try this (see a working example of this code in jsfiddle: http://jsfiddle.net/periklis/7ATLS/1/)

<input type = "button" id = "clickme" value="Click me!"/>
<div id = "alert_placeholder"></div>
<script>
bootstrap_alert = function() {}
bootstrap_alert.warning = function(message) {
            $('#alert_placeholder').html('<div class="alert"><a class="close" data-dismiss="alert">×</a><span>'+message+'</span></div>')
        }

$('#clickme').on('click', function() {
            bootstrap_alert.warning('Your text goes here');
});
</script>​

编辑：有现在简化和简化此过程的库，例如 bootbox.js

EDIT: There are now libraries that simplify and streamline this process, such as bootbox.js

这篇关于通过JavaScript动态创建Bootstrap警报框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！