jQueryUI对话框不显示

我想用一个函数生成一个jQuery UI对话框。该函数由onClick事件触发并正在执行，但由于某种原因，该对话框将不会显示。我相信这很简单。jQueryUI对话框不显示

如果可能，我宁愿以这种方式创建对话框，因为从单独的html页面加载对话框导致chrome上出现相同的原始问题。该代码是浏览器扩展的一部分，可以脱机使用，因此这种方式可以在不受原始限制的情况下使用。

我已经创建了一个类似的工作对话框，它在标签之间添加了一个参数。我已经尝试过与目前的一个，它没有奏效。

我在主页面添加了最新的jQuery ui和jQuery库。

我是新来的JavaScript和jQuery，但如果任何人都可以提供一些帮助，我将不胜感激。

感谢，

乔

function imageSelection() { 

var NewDialog = $('<div id="imageSelectionDialog"> ' + 

    "<ol id= \"selectable\">" + 
     "<li class=\"ui-state-default\"><img src=\"images/stock/image1.jpg\"/></li>" + 
     "<li class=\"ui-state-default\"><img src=\"images/stock/image2.jpg\"/></li>" + 
     "<li class=\"ui-state-default\"><img src=\"images/stock/image3.jpg\"/></li>" + 
     "<li class=\"ui-state-default\"><img src=\"images/stock/image4.jpg\"/></li>" + 
     "<li class=\"ui-state-default\"><img src=\"images/stock/image5.jpg\"/></li>" + 
     "<li class=\"ui-state-default\"><img src=\"images/stock/image6.jpg\"/></li>" + 
     "<li class=\"ui-state-default\"><img src=\"images/stock/image7.jpg\"/></li>" + 
     "<li class=\"ui-state-default\"><img src=\"images/stock/image8.jpg\"/></li>" + 
    "</ol>" + 

    "<form id=\"pieceSelection\">" + 
     "<div id=\"imageInput\">" + 
      "<input type=\"text\" id=\"image\" value=\"images/stock/walkin.jpg\"" + 
       "title=\"Select an image above or Paste a URL e.g http://server.com/path/to/image.jpg\"/>" + 
     "</div>" + 

     "<div id=\"radio\">" + 
      "<input type=\"radio\" id=\"radio1\" name=\"radio\" checked/>" + 
      "<label for=\"radio2\">x3</label>" + 
      "<input type=\"radio\" id=\"radio2\" name=\"radio\"/>" + 
      "<label for=\"radio3\">x4</label>" + 
      "<input type=\"radio\" id=\"radio3\" name=\"radio\"/>" + 
      "<label for=\"radio4\">x5</label>" + 
      "<input type=\"radio\" id=\"radio4\" name=\"radio\"/>" + 
      "<label for=\"radio5\">x6</label>" + 7 
      "<input type=\"radio\" id=\"radio5\" name=\"radio\"/>" + 
      "<label for=\"radio6\">x7</label>" + 
      "<input type=\"radio\" id=\"radio6\" name=\"radio\"/>" + 
      "<label for=\"radio7\">x8</label>" + 
      "<input type=\"radio\" id=\"radio7\" name=\"radio\"/>" + 
      "<label for=\"radio8\">x9</label>" + 
     "</div>" + 
    "</form>" + 
'</div> '); 


NewDialog.dialog({ 
    autoOpen: false, 
    modal: true, 
    height: 500, 
    width: 500, 
    title: 'Choose an image', 
    buttons: { 
     "Ok": function() { 
      $(this).dialog("close"); 
     } 
    } 
}); 

return false; 

}

来源

2013-01-03 Not_A_Dolphin

您的字符串中似乎有一个意外的7，这使得这个级联无效，导致Uncaught SyntaxError: Unexpected string。

更改此：

"<label for=\"radio5\">x6</label>" + 7 
"<input type=\"radio\" id=\"radio5\" name=\"radio\"/>" +

要么这样：

"<label for=\"radio5\">x6</label>" + 
"<input type=\"radio\" id=\"radio5\" name=\"radio\"/>" +

或本：

"<label for=\"radio5\">x6</label>" + 7 + 
"<input type=\"radio\" id=\"radio5\" name=\"radio\"/>" +

除了需要设置autoOpen到true如果希望对话框立即可见。

DEMO - 取出7，并设置autoOpen为true

来源

2013-01-03 23:17:52 Nope

谢谢弗朗索瓦，这是autoOpen属性。在编辑SO的代码时，这7个是偶然发生的。 –

你似乎并不被追加HTML到DOM，使其工作.. '' 之前

追加到身体你把它分配给一个Do = ialog，它应该工作..

var html = '<div id="imageSelectionDialog"> ' + 
      //other html ; 

$('body').append(html); 

var NewDialog = $("#imageSelectionDialog"); 

// Code to Initialize the dialog

来源

2013-01-03 23:14:02

弗朗索瓦的回答解决了我的问题，但感谢你的帮助都是一样的。 –

jQueryUI对话框不显示

回答

相关问题