我正在尝试将AJAX功能添加到基于WordPress的站点 .
当访问者单击菜单链接时,此代码会将所需页面的文本文本加载到主页面中:
$('#access a').click(function(event) {
event.preventDefault();
var url = $(this).attr('href');
$('#content').fadeOut(500, function() {
$('#content').load(url, function() {
$('#content').fadeIn(500);
});
});
});
我的问题在于搜索表单 . 它在页面中具有以下结构:
<div id="my_search"><form role="search" method="get" id="searchform" action="http://myurl.com/" >
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form></div>
当我在表单中键入单词测试,然后单击键盘上的#searchsubmit“按钮或Enter键时,我被重定向到具有以下地址的新WordPress页面:
http://www.myurl.com/?s=testing
这是使PHP工作的PHP代码:
<?php if ( have_posts() ) : ?>
<h1 class="page-title"><?php printf( __( 'Search Results for: %s', 'twentyten' ), '<span>' . get_search_query() . '</span>' ); ?></h1>
<?php
/* Run the loop for the search to output the results.
* If you want to overload this in a child theme then include a file
* called loop-search.php and that will be used instead.
*/
get_template_part( 'loop', 'search' );
?>
<?php else : ?>
<div id="post-0" class="post no-results not-found">
<h2 class="entry-title"><?php _e( 'Nothing Found', 'twentyten' ); ?></h2>
<div class="entry-content">
<p><?php _e( 'Sorry, but nothing matched your search criteria. Please try again with some different keywords.', 'twentyten' ); ?></p>
</div><!-- .entry-content -->
</div><!-- #post-0 -->
<?php endif; ?>
QUESTION: I want to prevent the default behavior on #searchsubmit click and on Enter key click, and load the content of the search results (http://www.myurl.com/?s=whateverwordItype) into the #content of the main page. How can I do that?
(我想我只需要以某种方式在jQuery代码中插入php代码,但是这个任务有点超出了我对jQuery和PHP的了解 . )
如果可能的话,我将非常感谢知识渊博的人提供的代码片段 .
2 回答
使用一些简单的jQuery和javascript
要通过ajax请求加载搜索结果,您可以使用以下代码直接从搜索结果页面获取它们:
注意:
$(data).find('#content')
假设您的search.php
结果聚合在一个id为内容的元素中,即<div id="#content"> ... Results ... </div>
以上内容将进入外部文件或放在关闭
</body>
标记之前 .您可以自定义
search.php
页面以组织输出结果 .试试这个
这将调用search.php,它将获取搜索字符串作为post变量,如
$_POST['search_string']
,在这里,您处理搜索字符串并回显结果,这将返回到页面data
. 拥有id为results
的div,$("#results").html(data);
会将搜索结果从search.php中输入div . 如果你想使用get,那么只需将jQuery funstion中的post替换为get,你就可以在search.php中使用$_GET[]
.希望这会对你有所帮助