2

有点愚蠢的问题，但我已经下载了 JqueryUI 选择菜单小部件，即使 Firebug 显示正在加载的相关 CSS 和 JavaScript 文件，它也无法正常工作。

页面脚本：

<script type="text/javascript">
   $('#brand_color').selectmenu({style:'popup'});
</script>

生成的表单标记：

<label for="brand_color">Color</label><br />
<select id="brand_color" name="brand[color]">
   <option value="red">red</option>
   <option value="green">green</option>
   <option value="blue">blue</option>
   <option value="black">black</option>
</select><br />

Rails 表单代码：

<%= f.label :color %><br />
<%= f.select(:color, Brand::COLORS) %><br />
4

1 回答 1

1

嗨，这肯定与包含所有必需的脚本有关。从这个演示中准确地说出你需要什么有点困难，但我确保包含所有相同的脚本并做了一个例子：http: //jsfiddle.net/8WWMT/7/

以下是所有脚本：

<link rel="stylesheet" href="http://view.jqueryui.com/selectmenu/themes/base/jquery.ui.all.css">
<script src="http://view.jqueryui.com/selectmenu/jquery-1.8.0.js"></script>
<script src="http://view.jqueryui.com/selectmenu/ui/jquery.ui.core.js"></script>
<script src="http://view.jqueryui.com/selectmenu/ui/jquery.ui.widget.js"></script>
<script src="http://view.jqueryui.com/selectmenu/ui/jquery.ui.position.js"></script>
<script src="http://view.jqueryui.com/selectmenu/ui/jquery.ui.menu.js"></script>
<script src="http://view.jqueryui.com/selectmenu/ui/jquery.ui.selectmenu.js"></script>
<link rel="stylesheet" href="http://view.jqueryui.com/selectmenu/demos/demos.css">​

此外，您必须确保在呈现 HTML 元素后调用您的 JS。您可以通过将<script>标签放置在 HTML 元素之后来执行此操作，例如. 或者通过将 JS 包含在 中$(function(){});，如下所示：

<script type="text/javascript">
    $(function(){
        $('#brand_color').selectmenu({style:'popup'});
    });
</script>

http://jsfiddle.net/8WWMT/10/

如果您将脚本部分放在 HTML 元素上方而不使用$(function(){});（就绪功能），请注意样式如何不起作用：http: //jsfiddle.net/8WWMT/11/

于 2012-09-12T18:12:35.227 回答