jQuery UI 自动完成对我不起作用
jQuery UI autocomplete doesn't work for me
我需要 jQuery 项目的自动完成功能,但它对我不起作用。
我不知道我的错误在哪里。
提前致谢!
<!DOCTYPE html>
<html>
<head>
<meta charset="iso-8859-1" />
<title>Votre titre</title>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/smoothness/jquery-ui.css" />
</head>
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js"></script>
<script>
var liste = [
"Draggable",
"Droppable",
"Resizable",
"Selectable",
"Sortable"
];
$('#recherche').autocomplete({
source : liste
});
</script>
<form>
<input type="text" id="recherche" />
</form>
</body>
</html>
这里的 html 语法存在多个问题:
- 将 jquery 个文件的脚本标签移动到 head 标签
- 将您的脚本移至正文之后
您的脚本必须位于 body 标记之后,或者可以将其放置在 head 标记之外,并使用文档就绪检查以允许它在页面加载后 运行(参见 http://learn.jquery.com/using-jquery-core/document-ready/) .一旦页面文档对象模型 (DOM) 准备好执行 JavaScript 代码,$( document ).ready()
中包含的代码只会 运行。
<!DOCTYPE html>
<html>
<head>
<meta charset="iso-8859-1" />
<title>Votre titre</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js"></script>
</head>
<body>
<form>
<input type="text" id="recherche" />
</form>
</body>
<script>
var liste = [
"Draggable",
"Droppable",
"Resizable",
"Selectable",
"Sortable"
];
$('#recherche').autocomplete({
source : liste
});
</script>
</html>
在此处查看工作示例https://jsfiddle.net/q7k28bp0/1/
我需要 jQuery 项目的自动完成功能,但它对我不起作用。 我不知道我的错误在哪里。 提前致谢!
<!DOCTYPE html>
<html>
<head>
<meta charset="iso-8859-1" />
<title>Votre titre</title>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/smoothness/jquery-ui.css" />
</head>
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js"></script>
<script>
var liste = [
"Draggable",
"Droppable",
"Resizable",
"Selectable",
"Sortable"
];
$('#recherche').autocomplete({
source : liste
});
</script>
<form>
<input type="text" id="recherche" />
</form>
</body>
</html>
这里的 html 语法存在多个问题:
- 将 jquery 个文件的脚本标签移动到 head 标签
- 将您的脚本移至正文之后
您的脚本必须位于 body 标记之后,或者可以将其放置在 head 标记之外,并使用文档就绪检查以允许它在页面加载后 运行(参见 http://learn.jquery.com/using-jquery-core/document-ready/) .一旦页面文档对象模型 (DOM) 准备好执行 JavaScript 代码,$( document ).ready()
中包含的代码只会 运行。
<!DOCTYPE html>
<html>
<head>
<meta charset="iso-8859-1" />
<title>Votre titre</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js"></script>
</head>
<body>
<form>
<input type="text" id="recherche" />
</form>
</body>
<script>
var liste = [
"Draggable",
"Droppable",
"Resizable",
"Selectable",
"Sortable"
];
$('#recherche').autocomplete({
source : liste
});
</script>
</html>
在此处查看工作示例https://jsfiddle.net/q7k28bp0/1/