如何使搜索查询术语大胆

时间:2016-11-26 23:51:02

标签: php css sql

如何仅将用户在搜索框中输入的查询字词设为BOLD?

我指的是每个搜索结果中的每个关键字。

与您键入搜索字词时一样,结果页面将为您提供所有结果,但您输入的字词在每个结果中都以粗体显示。

正如您所看到的,我确实已经在页面中设置了一个代码,该代码假设使条款变粗,但它不起作用。

这是我的搜索页面的完整代码:

 <!DOCTYPE html>
<html lang="en">
<head>
<title>CLIHELP - Help for Command Line Interface</title>
<!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<meta charset="utf-8">
<meta name="description" content="Help for Command Line Interface">
<meta name="author" content="clihelp.org">
<style>
/*    Generated by http://www.cssportal.com    */
@import url("reset.css");
body {
    font-family: Calibri, Candara, Segoe, 'Segoe UI', Optima, Arial, sans-serif;
    font-size: 13px;
    color:#333
}
p {
    padding: 10px;
}
#wrapper {
    width: 1000px;
}
#navigation {
    float: left;
    height: 30px;
    width: 1000px;
    background: #F2F2F2;
}
#content {
    float: left;
    background: #FFFFFF;
    width: 600px;
    padding: 5px 20px 5px 20px;
    line-height: 18px;
}
#rightcolumn {
    width: 336px;
    float: left;
}
#footer {
    height: 30px;
    width: 1000px;
    background: #F2F2F2;
    clear: both;
}
.navmenu {
    background-color: #F2F2F2;
}
.navmenu ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
    align-items: center;
}
.navmenu li:last-child {
    margin-left: auto;
}
.navmenu ul li a {
    text-decoration: none;
    margin: 4px;
    padding: 5px 20px 5px 20px;
    color: #FFFFFF;
    background: #4285F4;
    display: inline-block;
}
.feedback-search {
    font-size: 13px;
 }

.feedback-search a {
    text-decoration: none;
}

.feedback-search a:hover {
    text-decoration: underline;
}
.feedback-search a:visited {
    color: blue;
}

.title {
    font-size: 18px;
}

.title a {
   text-decoration: none;
}

.title a:hover {
   text-decoration: underline;
}
.title a:visited {
   color: blue;
}

.tags {
   font-size: 13px;
   color: #006621;
 }
.script {       
   font-size: 13px;
}
ul.dashboard {
   list-style-type: square;
   line-height: 18px;
   list-style-position:inside;
}
.dashboard a {
   text-decoration: none;
}
.dashboard a:hover {
   text-decoration: underline;
}
.dashboard a:visited {
   color: blue;
}
p.dashboard {
    font-weight: bold;
}
.footermenu ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
    align-items: center;
}
.footermenu ul li a {
    text-decoration: none;
    margin: 4px;
    padding: 5px 20px 5px 20px;
    display: inline-block;
}
.your-search {
    font-weight: bold;
}
input:focus {
    background-color: yellow;
}
</style>
</head>
<body>
    <?php include_once("analyticstracking.php") ?>
    <div id="wrapper">
        <div id="navigation">
            <div class="navmenu">
        <ul id=menu>
            <li><a href="http://www.clihelp.org">Clihelp</a></li>
            <li><a href="https://github.com/clihelp/dev_clihelp">GitHub</a></li>
            <li><form action='q.php' method='GET'>
                <input type='text' size='25' name='search' autofocus>
                <input type='submit' style='position: absolute; left: -9999px' name='submit'/>
                    </form></li>
        </ul>
    </div>
        </div>
        <div id="content">
            <?php
        $button = $_GET ['submit'];
        $search = $_GET ['search'];

        if (!$button)
        echo "you didn't submit a keyword";
        else {
        if (strlen($search) <= 1)
        echo "Search term too short";
        else {

        echo "<p>Your search - <span class='your-search'>$search</span> ";

        mysql_connect("localhost", "username", "password");
            mysql_select_db("DB");
            $search_exploded = explode(" ", $search);
            foreach ($search_exploded as $search_each) {
             $x++;
                if ($x == 1)
                $construct .= "(CONCAT(code,cliCommandId) LIKE '%$search_each%' OR  os LIKE '%$search_each%' OR title LIKE '%$search_each%' OR tags LIKE '%$search_each%' OR script LIKE '%$search_each%') ";
            else
                $construct .= "AND (CONCAT(code,cliCommandId) LIKE '%$search_each%' OR  os LIKE '%$search_each%' OR title LIKE '%$search_each%' OR tags LIKE '%$search_each%' OR script LIKE '%$search_each%')";
            }
            $construct = "SELECT * FROM cliCommand WHERE $construct";
            $run = mysql_query($construct);
            $foundnum = mysql_num_rows($run);
            if ($foundnum == 0)
                echo "- did not match any documents.</br></br>Suggestions:</br></br>- Make sure all words are spelled correctly.</br>- Try different keywords.</br>- Try more general keywords.</br>- Search by id.";
            else {

                echo "- About $foundnum results - <span class='feedback-search'><a href=''>Give us Feedback about this result</a></span><br><br>";
            while ($runrows = mysql_fetch_assoc($run)) {
                $cliCommandId = $runrows ['cliCommandId'];
                $code = $runrows ['code'];
                $os = $runrows ['os'];
                $title = $runrows ['title'];
                $tags = $runrows ['tags'];
                $script = $runrows ['script'];
                if (strlen($script) > 160) {
                    $script = substr($script, 0, 160) . "..."; // do we need to add ...
                }
                $script = str_bold($script);
                echo "
        <div class='title'><a href='script.php?cliCommandId=$cliCommandId&code=$code'>$title</a></div>
        <span class='tags'>$tags</span><br>
        $script<br>
        <p>
        ";
                            }
                    }
                }
        }
        function str_bold($str, $text)
        {
            $search_exploded = explode(" ", $_GET ['search']);
            foreach ($search_exploded as $search_each) {
            $str = preg_replace("/$search_each/i", '<b>$0</b>', $str);
            }
            return $str;
        }
            ?>          
       </div>
        <div id="rightcolumn">
            <p><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
        <!-- 336x280 Large Rectangle -->
        <ins class="adsbygoogle"
            style="display:inline-block;width:336px;height:280px"
            data-ad-client="-------"
            data-ad-slot="--------"></ins>
        <script>
        (adsbygoogle = window.adsbygoogle || []).push({});
        </script></p>
        <p class="dashboard">Latest Linux updates: under construction</p>
        <ul class="dashboard">
            <li><a href="">Configure Your Existing AD Forest and Domain</a></li>
            <li><a href="">Install Other Roles and Features on Windows Server 2008 R2 Server Core</a></li>
            <li><a href="">Start the DNS service</a></li>
        </ul>
        <br>
        <p class="dashboard">Latest macOS updates: under construction</p>
        <ul class="dashboard">
            <li><a href="">Configure Your Existing AD Forest and Domain</a></li>
            <li><a href="">Install Other Roles and Features on Windows Server 2008 R2 Server Core</a></li>
            <li><a href="">Start the DNS service</a></li>
        </ul>
        <br>
        <p class="dashboard">Latest Windows updates: under construction</p>
        <ul class="dashboard">
            <li><a href="">Configure Your Existing AD Forest and Domain</a></li>
            <li><a href="">Install Other Roles and Features on Windows Server 2008 R2 Server Core</a></li>
            <li><a href="">Start the DNS service</a></li>
        </ul>
        <br>
        </div>
        <div id="footer">
            <div class="footermenu">
        <ul id=menu>
            <li><a href="#">About</a></li>
        </ul>
        </div>  
        </div>
    </div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

function bold($result, $search) {
    return preg_replace("/$search/", "<strong>$search</strong>", $result);
}

while ($runrows = mysql_fetch_assoc($run)) {
    $cliCommandId = $runrows ['cliCommandId'];
    $code = $runrows ['code'];
    $os = $runrows ['os'];
    $title = $runrows ['title'];
    $tags = $runrows ['tags'];
    $script = $runrows ['script'];
    echo "
        <div class='title'><a href=''>".bold($title, $search)."</a></div>
        <div class='tags'>".bold($tags, $search)."</div>
        <div class='script'>".bold($script, $search)."</div><br>
        <p>";
}