我目前有一个用于输入州名称的自定义字段。我想在这个字段中使用jquery ui的自动完成功能。然而,我失败了。
这是我第一次使用jquery ui,我对php和jquery不太熟悉。我希望你们能给我一些建议。
这是我使用的代码:
(function ($){
$(document).ready(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"
];
(jqeury)( "#custom_field_city" ).autocomplete({
source: availableTags
});
})(jQuery);
上面是我用来调用自动完成功能的示例代码。但在我的自定义字段中什么都没有发生。没有填充列表。
由于上面的代码无法工作,所以我试图找到另一种实现jquery ui的方法,我找到了本文enter link description here然而,我坚持使用以下代码:
$(document).ready(function() {
//attach autocomplete
(jqeury)("#cctmcity").autocomplete({
//define callback to format results
source: function(req, add){
//pass request to server
$.getJSON("friends.php?callback=?", req, function(data) {
//create array for response objects
var suggestions = [];
//process response
$.each(data, function(i, val){
suggestions.push(val.name);
});
//pass array to callback
add(suggestions);
});
},
//define select handler
select: function(e, ui) {
//create formatted friend
var friend = ui.item.value,
span = $("<span>").text(friend),
a = $("<a>").addClass("remove").attr({
href: "javascript:",
title: "Remove " + friend
}).text("x").appendTo(span);
//add friend to friend div
span.insertBefore("#to");
},
//define select handler
change: function() {
//prevent \'to\' field being updated and correct position
$("#to").val("").css("top", 2);
}
});
})(jQuery);
我不希望从数据库中检索到如下源文件:
$.getJSON("friends.php?callback=?", req, function(data)
我希望从简单的地方检索它,如第一个示例。我该怎么做?
谢谢
SO网友:Wyck
您的第一个示例可以很好地进行一些小的修改(我将在下面添加),如图所示,http://jsfiddle.net/cDtv4/.
您需要做的是确保实际的jquery和jquery ui(可能还有jquery ui.css)脚本正在加载到您想要处理的页面上。
您可以通过查看源代码来实现这一点,如果源代码不存在,则需要将其排队,http://codex.wordpress.org/Function_Reference/wp_enqueue_script
您应该在源代码中看到类似的内容:
<script type=\'text/javascript\' src=\'http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js?ver=3.3.1\'></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
功能。
jQuery(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"
];
$( "#custom_field_city" ).autocomplete({
source: availableTags
});
});