javascript - 带有自定义 CSS 的 Jquery 自动完成

Question

我正在使用 default autocomplete source code .因为我用自己的 css 替换了 jquery-ui.css，所以我无法下拉所有选择框选项，而且我不知道如何去掉元素符号:

这是我的CSS:

.ui-autocomplete {
border: 1px solid #ccc;
width: 120px;
border-radius: 3px;
overflow: hidden;
background: #eeeeee;
}

.ui-autocomplete select {
padding: 5px 8px;
width: 120px;
border: none;
box-shadow: none;
background: #eeeeee url("arrow.png") no-repeat 90% 50%;
-webkit-appearance: none;
}

.ui-autocomplete select:focus {
outline: none;

}

.ui-menu .ui-menu-item a.ui-corner-all:hover, .ui-menu .ui-menu-item a.ui-corner-all:focus, .ui-menu .ui-menu-item a.ui-corner-all:active {
background:#ff8a00!important;
color:#000;
border-radius:0;
}

 .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
background: #ff8a00;
border: none;
color:#000;
border-radius:0;
font-weight: normal;
}

谢谢你们的帮助。

Answer 1

您缺少 .ui-menu 样式

.ui-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block;
    outline: none;
}

验证图像路径可能在其他文件夹中或根本不存在。

你可以在这里看到一个例子:

http://jsfiddle.net/x67pkxve/1/