为什么jquery UI无法正确呈现选择框

Question

我有一个简单的选择框：

<select id="targetDept" name="targetDept" class="ui-select" onclick="clearApprovers()">
<option value="1">blah</option>
<option value="2">blah2</option>
<option value="3">blah3</option>
<option value="4">blah4</option>
</select>

我尝试将它变成一个花哨的jquery选择框：

$(document).ready(function () {

    $(".ui-select").selectmenu();
    $(".ui-button").button();

});

以下是我的包含：

<link rel="stylesheet" href="js/jquery-ui-1.11.4/jquery-ui.theme.css">
        <script type="text/javascript" src="js/jquery-2.1.4.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.11.4/jquery-ui.js"></script>

它有效，但它使选择变成最丑陋的东西。不幸的是，由于公司的计算机政策，我无法上传图片，所以我会尝试描述它。

dropdow本身基本上是一个按钮，左右填充为0（即文本触及“按钮”的边框）。当我点击下拉列表时，它会打开一个SUPER宽跨度，大约是我实际页面宽度的3倍，在底部创建一个滚动条。每个选项都在一个大的黑色子弹点旁边，单击一个选项不会选择它，让选项保持打开而不是真的做任何事情......

我知道诊断并不容易，但要提前谢谢。

Answer 1

听起来你错过了jquery-ui核心css文件。如果您从Jquery主页下载了zip文件，那么它位于名为jquery-ui.css的根文件夹中。

主题文件仅提供颜色 - 而不是使其正常运行所需的基本样式。

Answer 2

你是否包含了jquery-ui包中的所有css文件？因为jquery-ui.theme.css只是jquery-ui.css的主题。