我尝试通过Wordpress Answers和其他类似资源进行清理，但是只遇到了实现Google类型搜索的问题，这不是我想要的。任何帮助或指出正确方向的人都将不胜感激。
#1 楼
以下使用jQuery UI Autocomplete，自3.3起已包含在WordPress中。 （我从@Rarst：D借来了格式）。仍然不完全是您想要的，但可以为您提供一个很好的起点。以下内容使用了一种基本的jQuery UI样式，但是您可以使用目前在Trac上开发的样式，并从您的插件文件夹中调用它。
class AutoComplete {
static $action = 'my_autocomplete';//Name of the action - should be unique to your plugin.
static function load() {
add_action( 'init', array( __CLASS__, 'init'));
}
static function init() {
//Register style - you can create your own jQuery UI theme and store it in the plug-in folder
wp_register_style('my-jquery-ui','http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css');
add_action( 'get_search_form', array( __CLASS__, 'get_search_form' ) );
add_action( 'wp_print_footer_scripts', array( __CLASS__, 'print_footer_scripts' ), 11 );
add_action( 'wp_ajax_'.self::$action, array( __CLASS__, 'autocomplete_suggestions' ) );
add_action( 'wp_ajax_nopriv_'.self::$action, array( __CLASS__, 'autocomplete_suggestions' ) );
}
static function get_search_form( $form ) {
wp_enqueue_script( 'jquery-ui-autocomplete' );
wp_enqueue_style('my-jquery-ui');
return $form;
}
static function print_footer_scripts() {
?>
<script type="text/javascript">
jQuery(document).ready(function ($){
var ajaxurl = '<?php echo admin_url( 'admin-ajax.php' ); ?>';
var ajaxaction = '<?php echo self::$action ?>';
$("#secondary #searchform #s").autocomplete({
delay: 0,
minLength: 0,
source: function(req, response){
$.getJSON(ajaxurl+'?callback=?&action='+ajaxaction, req, response);
},
select: function(event, ui) {
window.location.href=ui.item.link;
},
});
});
</script><?php
}
static function autocomplete_suggestions() {
$posts = get_posts( array(
's' => trim( esc_attr( strip_tags( $_REQUEST['term'] ) ) ),
) );
$suggestions=array();
global $post;
foreach ($posts as $post):
setup_postdata($post);
$suggestion = array();
$suggestion['label'] = esc_html($post->post_title);
$suggestion['link'] = get_permalink();
$suggestions[]= $suggestion;
endforeach;
$response = $_GET["callback"] . "(" . json_encode($suggestions) . ")";
echo $response;
exit;
}
}
AutoComplete::load();
#2 楼
好的，这将是非常基本的示例代码，该代码使用本机suggest.js（Ajax的WP内核）并绑定到默认搜索形式（来自未修改的get_search_form()调用）。这并不是您所要的，但渐进式搜索是获得完美的巨大痛苦。 :) class Incremental_Suggest {
static function on_load() {
add_action( 'init', array( __CLASS__, 'init' ) );
}
static function init() {
add_action( 'wp_print_scripts', array( __CLASS__, 'wp_print_scripts' ) );
add_action( 'get_search_form', array( __CLASS__, 'get_search_form' ) );
add_action( 'wp_print_footer_scripts', array( __CLASS__, 'wp_print_footer_scripts' ), 11 );
add_action( 'wp_ajax_incremental_suggest', array( __CLASS__, 'wp_ajax_incremental_suggest' ) );
add_action( 'wp_ajax_nopriv_incremental_suggest', array( __CLASS__, 'wp_ajax_incremental_suggest' ) );
}
static function wp_print_scripts() {
?>
<style type="text/css">
.ac_results {
padding: 0;
margin: 0;
list-style: none;
position: absolute;
z-index: 10000;
display: none;
border-width: 1px;
border-style: solid;
}
.ac_results li {
padding: 2px 5px;
white-space: nowrap;
text-align: left;
}
.ac_over {
cursor: pointer;
}
.ac_match {
text-decoration: underline;
}
</style>
<?php
}
static function get_search_form( $form ) {
wp_enqueue_script( 'suggest' );
return $form;
}
static function wp_print_footer_scripts() {
?>
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('#s').suggest('<?php echo admin_url( 'admin-ajax.php' ); ?>' + '?action=incremental_suggest');
});
</script><?php
}
static function wp_ajax_incremental_suggest() {
$posts = get_posts( array(
's' => $_REQUEST['q'],
) );
$titles = wp_list_pluck( $posts, 'post_title' );
$titles = array_map( 'esc_html', $titles );
echo implode( "\n", $titles );
die;
}
}
Incremental_Suggest::on_load();
#3 楼
当然，您必须使用Ajax来执行此操作，但是这里存在问题。由于WordPress使用MySQL，因此，如果您尝试通过Ajax通过真正的数据库查询来填充搜索，则可能会使您的服务器压力过大，但是您可能要做的是开发一个系统，将所有帖子保存到一个大的“ wp_options”字段，然后在完成搜索后，您从中查询而不是进行实际搜索。但是请记住，每次创建或编辑帖子时，都需要更新此文本/序列化变量。如果您不愿意花一些时间来开发此解决方案，我不建议您进行这种“实时搜索”。
评论
在这种用例中，与为Ajax请求加载WP核心相比，MySQL请求的资源使用将完全无关紧要。
–稀有
2012年2月20日在9:15
取决于您尝试执行Ajax请求的方式，在这种情况下，您实际上并不需要所有WP核心，最佳情况是仅加载$ wpdb并搜索您的字段。但是同意，使用主WP Ajax url都可能导致问题，即使处理不当也是如此。
– Webord
2012年2月20日在9:18
是的，我只是注意到MySQL的性能不会成为瓶颈（除非您有成千上万的帖子，等等）。 WP core慢得多。网络速度也较慢。
–稀有
2012年2月20日在9:23
是的，但是使用WP Core计算机进行某种调用要容易得多，而且速度更快。使用MySQL机器变得越来越慢。但是在正常安装中，我同意您的看法。
– Webord
2012年2月20日在9:36
评论
当用户点击建议时，您想做什么？只需在搜索框中填充它？将您带到相应的职位。用户仍然可以正常键入并获取搜索结果，只有点击建议才能直接指向该帖子。
我有一个快速的填充解决方案，但是链接有更多问题...请考虑一下。