ajax 搜索,无刷新搜索 php+mysql

ajax 搜索,无刷新搜索 php+mysql

 

演示

 

 

XML/HTML Code

<div class="textBox">

        <input type="text" value="" maxlength="100" name="searchBox" id="search">

        <div class="searchBtn">



        </div>

    </div>

    <br clear="all" />

    <div id="content">

        <div class="search-background">

            <label><img src="loader.gif" alt="" /></label>

        </div>

        <div id="sub_cont">



        </div>

    </div>

 

JavaScript Code

<script language="javascript">

$(document).ready(function(){

    //show loading bar

    function showLoader(){

        $('.search-background').fadeIn(200);

    }

    //hide loading bar

    function hideLoader(){

        $('#sub_cont').fadeIn(1500);

        $('.search-background').fadeOut(200);

    };



    $('#search').keyup(function(e) {



      if(e.keyCode == 13) {



        showLoader();

        $('#sub_cont').fadeIn(1500);

        $("#content #sub_cont").load("search.php?val=" + $("#search").val(), hideLoader());



      }



      });



    $(".searchBtn").click(function(){



        //show the loading bar

        showLoader();

        $('#sub_cont').fadeIn(1500);



        $("#content #sub_cont").load("search.php?val=" + $("#search").val(), hideLoader());



    });

});

</script>

 search.php

PHP Code

<?php

function checkValues($value)
{
     // Use this function on all those values where you want to check for both sql injection and cross site scripting
     //Trim the value
     $value = trim($value);

    // Stripslashes
    if (get_magic_quotes_gpc()) {
        $value = stripslashes($value);
    }

     // Convert all <, > etc. to normal html and then strip these
     $value = strtr($value,array_flip(get_html_translation_table(HTML_ENTITIES)));

     // Strip HTML Tags
     $value = strip_tags($value);

    // Quote the value
    $value = mysql_real_escape_string($value);
    return $value;

}

require "../../conn.php";

$rec = checkValues($_REQUEST['val']);



//get table contents


if($rec)

{

    $sql = "select * from content where message like '%$rec%'";

}

else

{

    $sql = "select * from content";

}



$rsd = mysql_query($sql);

$total =  mysql_num_rows($rsd);

?>



<?php

while ($rows = mysql_fetch_assoc($rsd))

{?>

    <div class="each_rec"><?php echo $rows['message'];?></div>

<?php

}

if($total==0){ echo '<div class="no-rec">No Record Found !</div>';}?>

 

原文地址:http://www.freejs.net/article_biaodan_282.html