jQuery 自动完成帮助
jQuery Autocomplete Assistance
第一次 post 所以请耐心等待...我一直在尝试将此处 http://jqueryui.com/autocomplete/ 的 jQuery 自动完成代码合并到我的项目中,以便我可以对其进行调整.在一天的大部分时间里,我一直在寻找解决方案,但没有成功。
我试过简单地将自动完成代码粘贴到 notepad++ 中并保存为 html 文件并在我的浏览器 (chrome) 中将其拉出,但没有成功,同样在 jsfiddle 中尝试结果。我可以看到文本框,但不幸的是,当我输入任何内容时,自动完成没有发现任何内容。
我不确定它是否与标签有关,或者我是否只是缺乏经验而遗漏了一些经验丰富的开发人员很快就会意识到的明显问题。
下面是我尝试从 jQuery 自动完成页面
添加参考代码
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
</body>
</html>
如有任何建议,我们将不胜感激。仅供参考,我的工作的第一部分如下所示(我知道我需要添加某些标签但不确定是哪个 - 即使在添加了示例代码中显示的标签之后我还是不成功。
<!doctype html>
<html>
<head>
<title>Your Team</title>
<meta charset="utf-8" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<style type="text/css">
您需要确保将库添加到 jsfiddle
我已经为您添加了 link(请注意左侧添加了 jquery 库)
JAVASCRIPT
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
HTML
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
第一次 post 所以请耐心等待...我一直在尝试将此处 http://jqueryui.com/autocomplete/ 的 jQuery 自动完成代码合并到我的项目中,以便我可以对其进行调整.在一天的大部分时间里,我一直在寻找解决方案,但没有成功。
我试过简单地将自动完成代码粘贴到 notepad++ 中并保存为 html 文件并在我的浏览器 (chrome) 中将其拉出,但没有成功,同样在 jsfiddle 中尝试结果。我可以看到文本框,但不幸的是,当我输入任何内容时,自动完成没有发现任何内容。
我不确定它是否与标签有关,或者我是否只是缺乏经验而遗漏了一些经验丰富的开发人员很快就会意识到的明显问题。
下面是我尝试从 jQuery 自动完成页面
添加参考代码<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
</body>
</html>
如有任何建议,我们将不胜感激。仅供参考,我的工作的第一部分如下所示(我知道我需要添加某些标签但不确定是哪个 - 即使在添加了示例代码中显示的标签之后我还是不成功。
<!doctype html>
<html>
<head>
<title>Your Team</title>
<meta charset="utf-8" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<style type="text/css">
您需要确保将库添加到 jsfiddle
我已经为您添加了 link(请注意左侧添加了 jquery 库)
JAVASCRIPT
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
HTML
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>