1

stackoverflow 上有很多类似的问题，但我找不到有效的答案。我有几个 Javascript 函数在多个页面中重复使用，所以我认为将它们移动到外部文件是个好主意。但是当我这样做时，它们不起作用。

以下是我目前在（目前是单独的）外部文件中拥有的两个功能：

function MessageDialog(obj, title, dialogText) {
  //add the dialog div to the page
  $('body').append(String.Format("<div id='messageDialog' title='{0}'><p>{1}</p></div>", title, dialogText));
  //create the dialog
  $('#messageDialog').dialog({
    modal: true,
    resizable: false,
    draggable: false,
    close: function(event, ui) { $('body').find('#messageDialog').remove(); },
    buttons:
      {
        'OK': function() {
          $(this).dialog('close');
        }
      }
  });
}

//Confirmation dialog
function ConfirmationDialog(obj, title, dialogText, okButtonText, cancelButtonText) {
  var confirmed = false;
  if (!confirmed) {
    //add the dialog div to the page
    $('body').append(String.Format("<div id='confirmationDialog' title='{0}'><p>{1}</p></div>", title, dialogText));
    //create the dialog
    $('#confirmationDialog').dialog({
      modal: true,
      resizable: false,
      draggable: false,
      close: function(event, ui) { $('body').find('#confirmationDialog').remove(); },
      buttons:
        {
          $okButtonText: function() {
            $(this).dialog('close');
            confirmed = true;
            if (obj) obj.click();
          },
          $cancelButtonText: function() {
            $(this).dialog('close');
          }
        }
      });
    }
    return confirmed;
}

我ConfirmationDialog()从一个OnClientClick事件中调用（在 ASP.NET 中）：

MessageDialog()如果btnDelIncident_Click事件发生错误，则从代码隐藏调用：

private void DisplayMessageDialog(string msgTitle, string msgText)
{
  StringBuilder msg = new StringBuilder();
  msg.AppendLine("<script type='text/javascript'>");
  msg.AppendFormat("  MessageDialog(this, '{0}', '{1}');" + System.Environment.NewLine, msgTitle, msgText);
  msg.AppendLine("</script>");
  ClientScript.RegisterStartupScript(this.GetType(), "messageDialog", msg.ToString());
}

我没有从ConfirmationDialog()调用中得到错误（尽管对话框没有出现），但是MessageDialog()调用（来自代码隐藏）在 Javascript 控制台中导致“未捕获的 ReferenceError：MessageDialog 未定义”。

我在<head>标签中包含了两个外部 Javascript 文件，它们位于 jQuery 之后：

<script type="text/javascript" src="/Scripts/ConfirmationDialog.js"></script>
<script type="text/javascript" src="/Scripts/MessageDialog.js"></script>

我也尝试将这两个<script>标签放在页面末尾，但没有任何区别。我究竟做错了什么？

编辑(function($) { });：我能够通过按照尼尔的建议包装函数来解决对话框问题。这是最终的工作函数（在外部 .js 文件中声明）：

//Confirmation dialog
(function($) {
  var confirmed = false;
  ConfirmationDialog = function(obj, title, dialogText, okButtonText, cancelButtonText) {
    if (!confirmed) {
      //add the dialog div to the page
      $('body').append(String.Format("<div id='confirmationDialog' title='{0}'><p>{1}</p></div>", title, dialogText));
      //create the dialog
      $('#confirmationDialog').dialog({
        modal: true,
        resizable: false,
        draggable: false,
        close: function(event, ui) { $('body').find('#confirmationDialog').remove(); },
        buttons:
        [{
          text: okButtonText,
          click: function() {
              $(this).dialog('close');
              confirmed = true;
              if (obj) obj.click();
           }
         },
         {
           text: cancelButtonText,
           click: function() {
            $(this).dialog('close');
           }
         ]}
      });
    }
    return confirmed;
  };
})(jQuery);
4

2 回答 2

1

您绝对不想将脚本标签放在外部 JavaScript 文件中。脚本标签是 HTML 元素，而 .js 文件不是 HTML。尝试将您的代码包装在立即调用的函数表达式中：

(function() {

    // your code here    

})();

如果您将函数调用绑定到 DOM 节点上的事件，例如“单击”或“悬停”，则应在执行这些绑定之前确保 DOM 已准备好。jQuery 有一个名为 .ready() 的方法，可用于此目的：

$(document).ready(function() {
});
于 2013-10-15T23:17:40.797 回答
0

这应该会有所帮助。在 MessageDialog 客户端方法中引用元素之前，您需要等到 DOM 加载完毕

  private void DisplayMessageDialog(string msgTitle, string msgText)
    {
      StringBuilder msg = new StringBuilder();
      msg.AppendLine("<script type='text/javascript'>");
      msg.AppendFormat("jQuery(function($) { MessageDialog(this, '{0}', '{1}'); });" + System.Environment.NewLine, msgTitle, msgText);
      msg.AppendLine("</script>");
      ClientScript.RegisterStartupScript(this.GetType(), "messageDialog", msg.ToString());
    }
于 2013-10-16T05:50:12.233 回答