javascript - 如何引用外部 JavaScript 显示 Bootstrap 3 警报

Question

我有一个带有 Bootstrap 3 的网页，我尝试使用下面的代码来显示警报框。

   <button class="btn btn-warning" onclick="warning('Are you sure ?')">Warning</button>

它在我的网页上与下面的 Javascript 一起工作正常。

window.error = function(msg) {
    var dom = '<div class="top-alert"><div class="alert alert-danger alert-dismissible fade in " role="alert"><i class="glyphicon glyphicon-exclamation-sign"></i> ' + msg + '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button></div></div>';
    var jdom = $(dom);
    jdom.hide();
    $("#id_template").append(jdom);
    jdom.fadeIn();
    setTimeout(function() {
        jdom.fadeOut(function() {
            jdom.remove();
        });
    }, 6000);
}

对于外部 JavaScript 文件，warning() 函数给出 ReferenceError: warning is not Defined

下面给出了我的外部 Js 示例

// JavaScript Document

function fetch(){

    var user = $("#id_owner").val();
    var firstname = $("#id_fname").val();
    if(firstname == ""){
        warning('You must enter First Name.');
        return false;
    }

}

Answer 1

您必须直接从外部 JavaScript 尝试以下代码。

if(firstname == ""){

    var dom = '<div id="modals" class="alert alert-danger" style="display:none;"><button data-dismiss="alert" class="close" type="button">×</button><span class="entypo-attention"></span>  <strong>Waring</strong>&nbsp;&nbsp;You must enter First Name.</div>';
    var jdom = $(dom);
    jdom.hide();
    $("id_template").append(jdom);
    jdom.fadeIn();
    setTimeout(function() {
        jdom.fadeOut(function() {
            jdom.remove();
        });
    }, 6000);
}