2017-06-02 1 views
0

Ok, ich habe google und überall auf dieser Seite gesucht und finde keine Lösung.Uncaught ReferenceError: Variable ist nicht definiert, aber IS ist in einer eingeschlossenen js-Datei definiert

Ich habe eine PHP-Datei mit einer Schaltfläche. Ich habe alle enthaltenen bootstrap/jquery-ui CSS-Dateien an der Spitze und die entsprechenden .js-Dateien am unteren Rand. Ich habe auch eine benutzerdefinierte .js-Datei, die eine Funktion hat, die ein benutzerdefiniertes Dialogfeld definiert. Wenn ich versuche, es von der PHP-Datei aufzurufen, erhalte ich:

ReferenceError: $myDialog is not defined.

Die mitgelieferte js-Datei aufgerufen wird dialog.js und IS im js Ordner.

Hier sind die PHP und JS-Dateien:

$(function() { 
 
    
 
    /** 
 
    * $myDialog Custom Dialog Function 
 
    * 
 
    * Example Usage: 
 
    * \t var theTitle = "CUSTOM TITLE GOES HERE!"; 
 
\t * \t var msg = 'Your message goes here...'; 
 
\t * \t $myDialog.dialog("option", "title", theTitle); 
 
\t * \t $myDialog.html(msg + '</div>'); 
 
\t * \t $myDialog.dialog('open'); 
 
    * 
 
    * Filename: dialog.js 
 
    **/ 
 

 
    var $myDialog = $('<div id="dialog-message">') 
 
    .dialog({ 
 
     modal: true, 
 
     draggable: false, 
 
     resizable: false, 
 
     position: ['center', 'center'], 
 
     width: 400, 
 
     
 
     dialogClass: 'dialog-message ui-dialog-osx', 
 
     title: "Important Message!", 
 
     autoOpen: false, 
 
     show: 'fade', 
 
     hide: 'fade', 
 
     buttons: [ 
 
      { 
 
       text: "Ok", 
 
       click: function() { 
 
        $(this).dialog("close"); 
 
       } 
 
      } 
 
     ],   
 
    }); 
 

 
});
<?php 
 
?> 
 

 
<!DOCTYPE html> 
 
\t <!--[if lt IE 7]>  <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]--> 
 
\t <!--[if IE 7]>   <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]--> 
 
\t <!--[if IE 8]>   <html class="no-js lt-ie9" lang=""> <![endif]--> 
 
\t <!--[if gt IE 8]><!--> <html class="no-js" lang=""> <!--<![endif]--> 
 
\t <head> 
 
\t \t <title>Rental Application</title> 
 
\t \t <!-- CSS Styles --> 
 
\t \t <link rel="stylesheet" type="text/css" href="css/html5reset.css" media="all" /> 
 
\t \t <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" media="all"> 
 
\t \t <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css" media="all"> 
 
\t \t <link rel="stylesheet" type="text/css" href="css/jquery-ui.css" media="all"> 
 
\t \t <link rel="stylesheet" type="text/css" href="css/drwebguy.css" media="all" /> 
 
\t </head> 
 
\t 
 
\t <body> 
 
\t \t <div id="home" class="container-fluid main_content"> 
 
\t \t \t <div class="row"> 
 
\t \t \t \t <div class="col-md-4"><a id="btnMyDialog" class="btn btn-primary" role="button">myDialog</a></div> 
 
\t \t \t \t <div class="col-md-4"> 
 
\t \t \t \t \t <p>This is just some text...</p> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="col-md-4"></div> 
 
\t \t \t </div><!-- row --> 
 
\t \t </div><!-- class="container-fluid" --> 
 
\t \t <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script> 
 
\t \t <script type="text/javascript" src="js/jquery-ui.min.js"></script> 
 
\t \t <script type="text/javascript" src="js/bootstrap.min.js"></script> 
 
\t \t <script type="text/javascript" src="js/bootstrap.min.js"></script> 
 
\t \t <script type="text/javascript" src="js/jquery.mask.min.js"></script> 
 
\t \t <script type="text/javascript" src="js/move-top.js"></script> 
 
\t \t <script type="text/javascript" src="js/easing.js"></script> 
 
\t \t <script type="text/javascript" src="js/js.cookie.js"></script> 
 
\t \t <script type="text/javascript" src="js/dialog.js"></script> 
 
\t \t <!--<script type="text/javascript" src="js/drwebguy.js">--></script> 
 
\t \t <script type="text/javascript"> 
 
\t \t \t $(function() { 
 
\t \t \t \t 
 
\t \t \t \t $('#btnMyDialog').on('click', function(){ 
 
\t \t \t \t \t var theTitle = "CUSTOM TITLE GOES HERE!"; 
 
\t \t \t \t \t var msg = 'Your message goes here...'; 
 
\t \t \t \t \t $myDialog.dialog("option", "title", theTitle); 
 
\t \t \t \t \t $myDialog.html(msg + '</div>'); 
 
\t \t \t \t \t $myDialog.dialog('open'); 
 
\t \t \t \t }); 
 
\t \t \t }); 
 
\t \t </script> 
 
\t </body> 
 
</html>

Und, natürlich, wenn ich am Ende meiner Datei, dass var Funktion setzen stattdessen eine externe JS-Datei von einschließlich es funktioniert gut ... aber auch offensichtlich, das den Zweck der OOP:/

Antwort

0

Gebrauch alle Skript wie folgt:

(function($) { 
    $(document).ready(function(){  
     // .. script what you want 
    }); 
})(jQuery); 
+0

Danke Fky, ich werde es versuchen. – luxgeek

+0

Immer noch der Fehler ... – luxgeek

Verwandte Themen