Question

我需要通过单击Firefox工具栏中的按钮（开发为Firefox扩展）来打开jQuery ui对话框。我在.xul文件中添加了.js文件，但由于某些原因它无法正常工作。我使用的是Mozilla Firefox 4.这是我的源代码：

.xul文件：

..

<script type="application/x-javascript" src="chrome://tuttoolbar/content/tuttoolbar.js" /> 
<script type="application/x-javascript" src="chrome://tuttoolbar/content/scripts/jquery-1.4.2.min.js" /> 
<script type="application/x-javascript" src="chrome://tuttoolbar/content/scripts/jquery-ui-1.8.4.custom.min.js"/>

...

<toolbarbutton id="Example" tooltiptext="UI Dialog" label="Open jQ dialog" oncommand="objTutorialToolbar.sayHello1(event); event.stopPropagation();"/>

tuttoolbar.js：

   ....

   var objTutorialToolbar = {

   ......

   sayHello1 : function(aEvent) {

    var docUrl =  window.content.document.location.href;

    var div = document.createElement("div");

    div.setAttribute("id", "dialog_dummy");

    var body = document.getElementsByTagName("body").item(0);

    body.appendChild(div);

    $dialog = $('#dialog_dummy').html('').dialog(
    {
      title : 'Title',
      modal : false,
      autoOpen : false,
      show : 'slide',
      hide : 'slide',
      url : docUrl,
      height: 550,
      width: 1050
    });

       $dialog.dialog("open");
    },

   ...

}

有人知道上面代码中的错误在哪里吗？

Answer 1

上面代码中的

document是您的代码正在执行的XUL文档。它不是HTML文档，因此它没有<body>元素（document.getElementsByTagName("body")为您提供一个空列表）。即使它有一个，我很确定jQuery的“对话框”是为HTML的定位系统而构建的，而不是为XUL中使用的盒子模型构建的。换句话说 - 它无法工作。您可能想要的是显示<panel>元素（请参阅https://developer.mozilla.org/en/XUL/panel）。或者甚至是一个完整的XUL对话窗口（见https://developer.mozilla.org/en/XUL/dialog和https://developer.mozilla.org/en/DOM/window.openDialog）。

Answer 2

但是，我遇到了问题：我无法从标题栏中删除位置。因此，我尝试创建并打开一个内联jQuery对话框，该对话框将隐藏标题中的位置。你知道如何做到这一点的更好方法吗？

Xul对话框和提示可自定义：

Dialogs and Prompts

Prompt Service

<强>提示：

var promptService = Components.classes["@mozilla.org/embedcomp/prompt-service;1"]
.getService(Components.interfaces.nsIPromptService);

var result = promptService.confirm(null, "Title of this Dialog", "Are you sure?");

// result is now true if OK was clicked, and false if cancel was clicked

<强>对话框：

<dialog
  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
  id="myDialogId"
  title="My Dialog"
  ondialogaccept="return onOK();"
  onload="onLoad();"
  persist="screenX screenY width height"
  windowtype="myDialogWindowType">

  <script type="application/javascript" src="chrome://myext/content/mydialog.js"/>
  <grid>
    <columns><column/><column/></columns>
    <rows>
      <row align="center"><label value="Name:"/><textbox id="name"/></row>
      <row align="center"><label value="Description:"/><textbox id="description"/></row>
      <row align="center"><spacer/><checkbox id="enabled" label="Check to Enable"/></row>
    </rows>
  </grid>
</dialog>

在Firefox扩展中打开jQuery ui Dialog

2 个答案: