Question

尝试了2天，感谢任何帮助。我可以让自动完成工作在div之外工作，我试图让它工作。具体的div，输入字段，不起作用。

我试过像其他人提到的那样设置 .ui-autocomplete { z-index：50000！important; 到了班级，但仍然无效。

以下是测试页面的链接。 div是前方和中心的“目的地”。 http://www.inidaho.com/responsive/test4.asp

这是我的标题代码：

<link rel="stylesheet" media="screen" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" media="screen" href="css/bootstrap.min.css">
<link rel="stylesheet" media="screen" href="css/glyphicons.css">
<link rel="stylesheet" media="screen" href="css/iitheme.css">
<link href='https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900,100italic,300italic,400italic,500italic,700italic,900italic' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>
<script>
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran"
];
$("#destination").autocomplete({
source: availableTags
});
});
</script>

这是我尝试自动填充的输入

<form id="home-searchform" class="home-searchform">
<div class="col-lg-8 col-med-5 col-sm-4 col-xs-12 text-center ui-widget">
<label for="destination">destination</label>
<input id="destination" name="destination" placeholder="Choose Destination">
</div>
<div class="col-lg-4 col-med-3 col-sm-3 col-xs-12">
<input type="button" name="submit" value="GO" class="ui-btn med ui-main txt-    center"/>
</div>
</form>

我已经尝试正确格式化上面的代码，但我很难道歉。任何建议表示赞赏。最好的。

Answer 1

您的代码在此处发布时很好，但在您引用的页面中，您有两个输入，其ID为＆＃34; destination＆＃34;。这导致了你的问题。如果重命名其中一个的ID，则代码可以正常工作。

例如：

HTML：

<input id="destinationMain" name="destination" placeholder="Choose Destination">

JavaScript的：

$("#destinationMain").autocomplete({
    source: availableTags
});

Jquery-ui自动完成功能仅在特定的情况下不起作用

1 个答案: