從外部調用jQuery中定義的函數

Question

我的aspx頁面： -

  <script src="js/jquery-1.4.2.js" type="text/javascript"></script>
  <script src="js/jquery-ui-1.8.2.custom.js" type="text/javascript"></script>

  <script type="text/javascript">
    $(document).ready(function () {
      //lots of other code here....
      function showMessage(){
        $("#msgDiv").dialog({
                        modal: true,
                        buttons: {
                                  Ok: function() {
                                          $(this).dialog('close');
                                      }
                        },
                        resizable: true,
                        show: "explode",
                        position: "center",
                        closeOnEscape: true,
                        draggable: false
                      });
      }
    });
   </script>

從上面的頁面觸發的另一個aspx彈出頁面

<script type="text/javascript">

    window.opener.document.getElementById("msgDiv").innerHTML = <%=MessageToShow%>; //works very well for me.
    window.opener.document.showMessage(); // I am unable to access it like this?
    window.close();

</script>

基本上我想從彈出窗口調用showMessage() 。 我還有其他邏輯可以在兩個頁面中執行。

Answer 1

在文檔准備中聲明你的函數：

$(document).ready(function() {

    window.showMessage = function() {
        //...
    };

});

然后你應該可以從其他文檔中調用它，如下所示：

window.opener.showMessage();

因為它在全局范圍內，所以只需通過調用就可以在主文檔中調用它

showMessage();

Answer 2

據我所知，你想做什么，不能做。 那么，我們到底能做什么呢？

我認為最簡單的想法是將showMessage移到ready函數之外，然后從內部調用它。

現在，如果它必須在該函數中定義，請將其命名為命名函數：

  function calledonready()
  {
      /// stuff
      function showMessage(){ 
      /// stuff
      }
   }

$(document).ready(calledonready);

window.opener.document.calledonready.showMessage(); 

Answer 3

您可以直接將showMessage()聲明放在<script>標記下。 好吧，事實證明這是不好的做法，但它會奏效。

更好的解決方案應該始終是使用您自己的命名空間。 聲明一個可以發生所有應用程序邏輯的object 。

<script>
var MyApp = {
    showMessage:   function(){
       // do something
    }
};

稍后在您的代碼中，您可以從任何地方訪問此對象

MyApp.showMessage();

您可以通過使用closures來擴展該模式。 因此，許多聰明人為ecmascript制定了很好的模式。 道格拉斯·克羅克福德（Douglas Crockford）一直都是“Javascript：好的部分”。

var MyApp = function(){
    var my_private_data = "version 1.0.0",
        foo             = "bar";

     return {
        getfoo          = function(){
             return(foo);
        },
        showMessage     = function(){
             // do something
        }
     };
};

var app = MyApp();

app.showMessage();

這完全是關於private data和namespacing 。 這樣，您身邊的其他任何腳本都無法更改您在closured對象中保留的任何日期。 通過創建inheritance和shared data （半保護），這個想法甚至可以更進一步，但我想這是另一個故事。