未捕获的TypeError:$ .growl不是函数

时间:2015-05-29 01:50:42

标签: javascript php jquery jgrowl

我一直收到"Uncaught TypeError: $.growl is not a function"错误。以下是我定义Growl调用的方式,它显示了我如何引用Growl。我在这里错过了什么?我该如何解决这个错误?

的index.php

<head>
    <title>HOST Continuous Integration</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <link rel="stylesheet" type="text/css" href="HCIstyle.css">
    <link rel="shortcut icon" href="Images/wci_favicon.ico">
    <link href='http://fonts.googleapis.com/css?family=Armata' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Graduate' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Source+Code+Pro:400,900' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Audiowide' rel='stylesheet' type='text/css'>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js' type="text/javascript"></script>
    <script src='http://ksylvest.github.io/jquery-growl/javascripts/jquery.growl.js' type='text/javascript'></script> 
    <link href="http://ksylvest.github.io/jquery-growl/stylesheets/jquery.growl.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.11.1.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<style type="text/css">
    .table_outer { height: 15em; overflow: auto; }
</style>

</head>

script.js是我调用Growl函数的文件:

// This function is called when, in the Submit Tab,
// the "Check Gerrits" button is clicked.
$("#check_gerrits_button").click(function(event) {
    event.preventDefault();
    if ($("#gerrits").val() == "") {
        alert("Please enter gerrits.");
    } else {
        $("#main_form_su_validation_table").empty();
        var data = { 'product_lines' : [], 'gerrits' : [], 'contacts' : [],'component' : ($("#component").val())};
        //find all pl's that are checked
        $("input[name=product_line]:checked").each(function() {
           data['product_lines'].push($(this).val());
        });
        data['gerrits'] = ($("#gerrits").val()).split(",");
        data['contacts'] = ($("#contacts").val()).split(",");
        console.log("in chck gerrits");
        console.log(data);
        submitted = 'False';
        $.ajax({
            dataType: "json",
            type: "POST",
            url: "getsubmittedgerritsforSI.php",
            data: data,                        
            error: function (xhr, ajaxOptions, thrownError,response) {
                // send the error mail -TBD
                console.log(thrownError);
                console.log(xhr);
                alert(xhr.status);
                alert(thrownError);                         
            },
            success : function(response){
                console.log("get gerrits sucess");
                console.log(response);              
                var data_cp = [];
                var submittedlist = [];
                $("input[name=product_line]:checked").each(function() {
                  for (var si in response) {
                    console.log(response[si]);
                    for (var i = 0; i < response[si].length; i++) {
                        gerrit  = response[si][i]
                        data_cp.push(gerrit);
                    }
                  }
                });
                console.log(data_cp);
                var ui_gerrits = ($("#gerrits").val()).split(",");
                // this loop is to get the intersection of ui_gerrits and data_cp(database)
                for (var i = 0; i < ui_gerrits.length; ) {
                    for (var j = 0; j < data_cp.length; ) {
                        if (ui_gerrits[i] == data_cp[j] ){
                            submittedlist.push(ui_gerrits[i]);
                            submitted = 'True';
                        }                           
                        j++;
                    }
                    i++;
                }
                console.log(submittedlist);
                if (submitted = 'True' && submittedlist.length == ui_gerrits.length ){
                    //alert(str.fontcolor( "blue" ));
                    //$(function() { $.growl({ title: "Growl", message: "errits already released in SU or Submitted for SU!" })});
                    //$.growl(submittedlist + ": gerrits already released in SU or Submitted for SU");
                        $(function() {
                          $.growl({
                            title: "Growl",
                            message: "Gerrits already released in SU or Submitted for SU!"
                          });
                        });                 
                }else if ((submitted = 'True') && (submittedlist.length != 0) ){
                    //alert(str.fontcolor( "blue" ));
                    //$.growl(submittedlist + ": gerrits already released in SU or Submitted for SU \nPlease remove " + submittedlist + " and resubmit remaining gerrits"); 
                    $(function() {
                          $.growl({
                            title: "Growl",
                            message: "Gerrits already released in SU or Submitted for SU!"
                          });
                    });
                }
                else{
                    SUValidation(data, '#main_form_su_validation_table', '#gerrits', "main_form");          
                }
            }
        });     
    }    
});
    });

2 个答案:

答案 0 :(得分:2)

您缺少jQuery库。 jQuery growl插件依赖于jQuery库。您可以从this等CDN中包含jQuery库,也可以在本地包含它。 但请确保在jquery growl库之前包含它。

以下是您的源代码的样子。

<head>
  <link href="http://ksylvest.github.io/jquery-growl/stylesheets/jquery.growl.css" rel="stylesheet" type="text/css">
</head>
<body>
  <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <script src='http://ksylvest.github.io/jquery-growl/javascripts/jquery.growl.js' type='text/javascript'></script>
  <script type="text/javascript">
    $(function() {
      $.growl({
        title: "Growl",
        message: "errits already released in SU or Submitted for SU!"
      });
    });
  </script>
</body>

另外,请阅读 Installation step in jQuery growl website here

更新

你有两个jQuery库导致了这个问题。

答案 1 :(得分:0)

问题的原因是由于jquery文件的多重引用。在growl之后的jquery文件将重新创建$实例,因此已注册的growl被删除。

请将其删除或使用jquery conflict