Хорошо, я очень просто пытаюсь взять этот пример ... http://jsfiddle.net/shanabus/HGF59/ и поместить его на тестовую страницу на моем собственном сервере для игры. У меня есть еще один фрагмент кода jquery, который отлично работает на другой странице. Я что-то упускаю здесь?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery demo</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.18/themes/base/jquery-ui.css" type="text/css" media="all" />
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
<script type="text/javascript" src="jquery-1.7.1.js"></script>
<script type="text/javascript">
$(function() {
var areas = [{
value: "area1",
label: "Area 1",
desc: "Area 1 extended description"},
{
value: "sample2",
label: "Sample 2",
desc: "Sample of the second area"},
{
value: "third-area",
label: "Third Area",
desc: "This is the third area"}];
var projects = [{
value: "jquery",
label: "jQuery",
desc: "the write less, do more, JavaScript library",
id: 1
}, {
value: "jquery-ui",
label: "jQuery UI",
desc: "the official user interface library for jQuery",
id: 2
}, {
value: "sizzlejs",
label: "Sizzle JS",
desc: "a pure-JavaScript CSS selector engine",
id: 3
}];
$("#areas").autocomplete({
minLength: 0,
source: areas,
select: function(event, ui) {
$("#areas").val(ui.item.label);
$("#project-div").show();
return false;
}
}).data("autocomplete")._renderItem = function(ul, item) {
return $("<li></li>").data("item.autocomplete", item).append("<a>" + item.label + "<br>" + item.desc + "</a>").appendTo(ul);
};
$("#project").autocomplete({
minLength: 0,
source: projects,
focus: function(event, ui) {
$("#project").val(ui.item.label);
return false;
},
select: function(event, ui) {
$("#project").val(ui.item.label);
$("#project-id").val(ui.item.id);
$("#project-description").html(ui.item.desc);
alert("I could submit form with id " + ui.item.id);
return false;
}
}).data("autocomplete")._renderItem = function(ul, item) {
return $("<li></li>").data("item.autocomplete", item).append("<a>" + item.label + "<br>" + item.desc + "</a>").appendTo(ul);
};
});
</script>
</head>
<body>
<div class="demo">
<label>Choose area:</label>
<input id="areas" />
<br />
<div id="project-div" style="display: none;">
<label>Choose project:</label>
<input id="project" />
<input type="hidden" id="project-id" />
<p id="project-description"></p>
</div>
</div>
</body>
</html>
Страница называется test.html и находится в той же папке, что и jquery-1.7.1.js. Спасибо!