使用themeroller css时jquery对话框的问题

jquery ui对话框的演示都使用“flora”主题。 我想要一个自定义主题,所以我使用themeroller生成一个css文件。 当我使用它时,一切似乎都工作正常,但后来我发现我无法控制对话框中包含的任何输入元素(即,无法键入文本字段,无法检查复选框)。 进一步的调查显示,如果我将对话框属性“modal”设置为true,就会发生这种情况。 当我使用植物主题时,这不会发生。

这是js文件:

topMenu = { init: function(){ $("#my_button").bind("click", function(){ $("#SERVICE03_DLG").dialog("open"); $("#something").focus(); }); $("#SERVICE03_DLG").dialog({ autoOpen: false, modal: true, resizable: false, title: "my title", overlay: { opacity: 0.5, background: "black" }, buttons: { "OK": function() { alert("hi!"); }, "cancel": function() { $(this).dialog("close"); } }, close: function(){ $("#something").val(""); } }); } } $(document).ready(topMenu.init); 

这是使用植物主题的html:

     sample        
please enter something

 

这是使用下载的themeroller主题的html:

     sample        
please enter something

 

如您所见,只有引用的css文件和类名称不同。 有人知道可能出现什么问题吗?

@David:我试过了,它似乎不起作用(在FF或IE上都没有)。 我试过内联css:

 style="z-index:5000" 

我也尝试过引用外部css文件:

 #SERVICE03_DLG{z-index:5000;} 

但这些都不奏效。 我错过了你建议的东西吗?

编辑:
通过brostbeef解决!
由于我最初使用植物群,我错误地认为我必须指定一个类属性。 事实certificate,只有在您实际使用植物群主题时(例如样本中)才会出现这种情况。 如果使用自定义主题,则指定类属性会导致该奇怪行为。

我认为这是因为你有不同的课程。

(植物群)

(自定义)

即使使用flora主题,您仍然可以使用ui-dialog类将其定义为对话框。

我以前做过模态,我甚至从未在标签中定义过类。 jQueryUI应该为你照顾。

尝试删除class属性或使用“ui-dialog”类。

在Firebug中使用此function后,如果您将一个大于1004的z-index属性添加到您的默认div,即“SERVICE03_DLG”的ID,那么它将起作用。 我会给它一些非常高的东西,比如5000,只是为了确定。

我不确定导致这种情况的themeroller CSS是什么。 他们可能改变或忽略了目标div的位置属性,它变成了一个对话框。

我尝试使用对话框和选项卡实现一个themeroller主题,结果发现themeroller CSS不适用于官方jQuery ! 特别是对于对话框和制表符,他们修改了官方jquery中的元素类。 请参见此处: http : //filamentgroup.com/lab/introducing_themeroller_design_download_custom_themes_for_jquery_ui/

用户的评论:

3)我下载的生成主题似乎不完整 – 当我尝试使用它时,我的标签(使用植物主题,代码与文档示例相同)不会被设置为标签

遇到3我认为我被卡住了,并且必须使用“菌群”恢复…我已经通过阅读“demo”文件的源代码发现,如果我调整我的html并给出

  • 项目我就是使用我的选项卡“ui-tabs-nav-item”类然后它将工作。
  • 因此,不幸的是,由themeroller生成的主题是不完整的。 如果标签内容不完整,那我就会想知道还有什么是不完整的。 这令人沮丧。 🙁

    其次是themeroller开发者评论:

    3)我们来看看。 你应该通过插件添加这些类是正确的。 但就目前而言,将它们添加到标记中可能不会有太大影响,因此您可以使用themeroller主题。 不过,我们会检查一下。 我认为我们的选择器可以基于父ui-tabs选择器,但我认为我们试图不在选择器中使用元素。 在待办事项列表中考虑它

    伙计,这是一个很好的。 我试过在这两页上做了很多事情。 您是否尝试完全离开CSS然后尝试两个页面? 我使用Firebug从两个页面上的标题中删除CSS,输入仍然在一个而不是另一个上 – 但是,我倾向于认为Firebug没有从渲染中完全删除CSS,而你如果你真的从代码中删除它会得到不同的结果。

    我还发现你可以使用鼠标将文本粘贴到文本框中 – 它只是不接受键盘输入。 但是,似乎没有任何事件处理程序可以干扰这一点。