在库加载之前调用jquery函数的脚本

Question

我有Jquery函数的问题。

我从谷歌获得jquery库。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script> 

首先，我把下面的代码在一个.js

(function($){ 
jQuery.fn.jConfirmAction = function (options) { 
    var theOptions = jQuery.extend ({ 
     question: "Are You Sure ?", 
     yesAnswer: "Yes", 
     cancelAnswer: "Cancel" 
    }, options); 

    return this.each (function() { 

     $(this).bind('click', function(e) { 
      var submitBtn = $(this); 
      if($(this).attr("jconfirmed")){ 
       submitBtn.removeAttr("jconfirmed"); 
      }else{ 
       e.preventDefault(); 
       thisHref = $(this).attr('href'); 

       var btns = {}; 
       btns[theOptions.yesAnswer]=function() {               
         $(this).dialog("close");          
         if (thisHref!=null){ 
           window.location = thisHref; 
         }else{ 
           submitBtn.attr("jconfirmed", true); 
           submitBtn.click(); 
         } 
       }; 

       btns[theOptions.cancelAnswer]=function() {                
        $(this).dialog("close");          
        submitBtn.removeAttr("jconfirmed"); 
       }; 

       var content='<p>'+theOptions.question+'</p>'; 
       if(theOptions.checkboxText!=undefined){ 
         content='<p>'+'<input type="checkbox" id="cbox">'+theOptions.checkboxText+'<br/><br/>'+theOptions.question+'</p>'; 
       } 

       $('#dialog-confirm').html(content); 
       $('#cbox').click(function() { 
        /* 
        if($('#cbox').attr("checked")){ 
          $('.ui-dialog-buttonset button:first-child').show(); 
        }else{ 
          $('.ui-dialog-buttonset button:first-child').hide(); 
        } 
        */ 
       }); 

       $('#dialog-confirm').dialog({ 
        resizable: false, 
        modal: true, 
        buttons: btns, 
        show: { 
         effect: "blind", 
         duration: 1000 
         }, 

        hide: { 
          effect: "explode", 
          duration: 1000 
        }, 
        draggable: false, 
        dialogClass: 'main-dialog-class' 
       }); 
      } 
     }); 

    }); 
}; 
})(jQuery); 

而且，在JSP文件中调用该函数。

<script type="text/javascript"> 
$(document).ready(function() { 
    $('.confirm').jConfirmAction(); 
}); 
</script> 

但我有以下错误控制台：

Uncaught TypeError: Object [object Object] has no method 'jConfirmAction'

我试图把在同一个JSP的功能代码，<script type="text/javascript"></script>之间解决这一问题。这适用于某些页面，但在其他页面中有相同的错误。有没有办法只有在jquery已经加载的情况下调用函数？

Answer 1

总结整个JS代码的document.ready（）

$(document).ready(function() { 
    (function ($) { 
     jQuery.fn.jConfirmAction = function (options) { 
      var theOptions = jQuery.extend({ 
       question: "Are You Sure ?", 
       yesAnswer: "Yes", 
       cancelAnswer: "Cancel" 
      }, options); 

      return this.each(function() { 

       $(this).bind('click', function (e) { 
        var submitBtn = $(this); 
        if ($(this).attr("jconfirmed")) { 
         submitBtn.removeAttr("jconfirmed"); 
        } else { 
         e.preventDefault(); 
         thisHref = $(this).attr('href'); 

         var btns = {}; 
         btns[theOptions.yesAnswer] = function() { 
          $(this).dialog("close"); 
          if (thisHref !== null) { 
           window.location = thisHref; 
          } else { 
           submitBtn.attr("jconfirmed", true); 
           submitBtn.click(); 
          } 
         }; 

         btns[theOptions.cancelAnswer] = function() { 
          $(this).dialog("close"); 
          submitBtn.removeAttr("jconfirmed"); 
         }; 

         var content = '<p>' + theOptions.question + '</p>'; 
         if (theOptions.checkboxText !== undefined) { 
          content = '<p>' + '<input type="checkbox" id="cbox">' + theOptions.checkboxText + '<br/><br/>' + theOptions.question + '</p>'; 
         } 

         $('#dialog-confirm').html(content); 
         $('#cbox').click(function() { 
          /* 
         if($('#cbox').attr("checked")){ 
           $('.ui-dialog-buttonset button:first-child').show(); 
         }else{ 
           $('.ui-dialog-buttonset button:first-child').hide(); 
         } 
         */ 
         }); 

         $('#dialog-confirm').dialog({ 
          resizable: false, 
          modal: true, 
          buttons: btns, 
          show: { 
           effect: "blind", 
           duration: 1000 
          }, 

          hide: { 
           effect: "explode", 
           duration: 1000 
          }, 
          draggable: false, 
          dialogClass: 'main-dialog-class' 
         }); 
        } 
       }); 

      }); 
     }; 
    })(jQuery); 
}); 

包含在文件末尾所有的JS文件，然后再试一次，和一个侧面说明？使用'！=='将变量与'null'和'undefined'进行比较