jQuery + PHP 网站搜索栏答案

【问题标题】：jQuery + PHP search bar for websitejQuery + PHP 网站搜索栏
【发布时间】：2015-07-29 12:19:52
【问题描述】：

我正在尝试为一个非常简单的网站制作搜索栏。我有三个页面：主页、列表和联系人。每个页面的标题都是相同的。它包含一个搜索栏。我有一段非常好的代码，可以在可搜索列表的同一页面中完美运行，但我不知道如何让它在其他两个页面上运行。到目前为止，我有：

标题的 HTML：

<form id="search" action="katalogs" method="POST">
    <fieldset>
        <input type="text" id="filter" name="filter" value="" />
        <span id="filter-word"></span>
    </fieldset>
</form>

列表的 HTML：

<ul>
    <li>List item red</li>
    <li>List item yellow</li>
    <li>List item blue</li>
    <li>List item green</li>
    <li>List item gray</li>
    <li>List item pink</li>
    <li>List item aqua</li>
    <li>List item brown</li>
    <li>List item orange</li>
    <li>List item purple</li>
</ul>

JS代码：

$(document).ready(function(){
    $("#filter").keyup(function(){ 

        var filter = $(this).val(), count = 0;

        $("ul li").each(function(){

            if ($(this).text().search(new RegExp(filter, "i")) < 0) {
                $(this).css("opacity", "0.5");

            } else {
                $(this).css("opacity", "1");
            }
        });

        var numberItems = count;
        $("#filter-count").text("You searched for" + filter);
    });
});

我可以使用 PHP，到目前为止，我是这样开始的：

<?php
    $search = $_POST['filter'];

    if (isset($search)) {
        echo "var search is $search";
    } else {
        echo "Nothing";
    }
?>

我被困住了。如何显示结果？如何将搜索字符串从主页和联系人页面传递到列表页面？任何帮助表示赞赏！谢谢！

【问题讨论】：

我发现了这个问题：stackoverflow.com/questions/8469233/… 但我仍然卡住了。有人可以解释一下吗？
我也找到了这个：blog.grapii.com/2010/08/…，但我仍然需要重定向部分:(拜托，拜托，请帮帮我！

标签： php jquery search

【解决方案1】：

感谢那些试图提供帮助的人。我想出了如何让它工作。我的代码：

<?php 
    if(isset($_POST["filter"])) {
        $search = $_POST["filter"];
    } else {
        $search = "";
    }
?>

    <ul>
        <li>List item red</li>
        <li>List item yellow</li>
        <li>List item blue</li>
        <li>List item green</li>
        <li>List item gray</li>
        <li>List item pink</li>
        <li>List item aqua</li>
        <li>List item brown</li>
        <li>List item orange</li>
        <li>List item purple</li>
    </ul>

<script>

var test = "<?php echo $search ?>";
if (test.trim()) {
     var filter = test;
     $("li").each(function(){
         if ($(this).text().search(new RegExp(filter, "i")) < 0) {
             $(this).hide("slow");
         } else {
             $(this).show("slow");
         }
     });
     var numberItems = count;
     $("#filter-count").text("Atrasti " + count + " meklējumi " + "\"" + filter + "\"");
}

 $("#filter").keyup(function(){ 
     var filter = $(this).val();
     $("li).each(function(){
         if ($(this).text().search(new RegExp(filter, "i")) < 0) {
             $(this).hide("slow");
         } else {
             $(this).show("slow");
         }
     });
 });

</script>

【讨论】：