AJAX从multipul字段搜索MySQL数据库 - AJAX Search on MySQL Database from multipul field

AJAX Search on MySQL Database from multipul field

AJAX建议组合多个输入。怎么做？

            <label class="bookLabel">Book Id</label>
            <input id="book" class="bookNameInput" name="bookId" ><br>
            <label class="bookLabel">Book Name</label>
            <label class="bookFormLabel">Title </label>
            <input id="bookName" class="bookNameInput" name="bookTitle" autocomplete="off" required />
            <div id="searchResult">
    </div>

在MySQL数据库中，我有一个名为books的表和名为BookID和BookName的属性。我正在研究PHP。

        <script type="text/javascript" src="application/jquery-1.8.0.min.js"></script>
        <script type="text/javascript">
        $(function(){
            $(".bookNameInput").keyup(function()
            {
                var bookName = $(this).val();
                var dataString = 'bookNameInput='+ bookName;
                if(bookName!='')
                {
                    $.ajax({
                        type: "POST",
                        url: "application/searchBook.php",
                        data: dataString,
                        cache: false,
                        success: function(html)
                        {
                            $("#searchResult").html(html).show();
                        }
                    });
                }return false;
            });
            jQuery("#searchResult").live("click",function(e){
                var $clicked = $(e.target);
                var $name = $clicked.find('.name').html();
                var decoded = $("<div/>").html($name).text();
                $('#bookName').val(decoded);
            });
            jQuery(document).live("click", function(e) {
                var $clicked = $(e.target);
                if (! $clicked.hasClass("bookNameInput")){
                    jQuery("#searchResult").fadeOut();
                }
            });
            $('#bookName').click(function(){
                jQuery("#searchResult").fadeIn();
            });
        });

但这是一个输入框。如何为两个输入做这件事，这样我就可以这样做：

$q=$_POST['bookId'];
$r=$_POST['bookNameInput'];
$query="select * from books where BookId like '%$q%' and BookName like '%$r%' order by BookID";
$sql_res= mysqli_query($connection, $query);
while($row=mysqli_fetch_assoc($sql_res))
{
    $Name=$row['BookName'];
    $b_name='<strong>'.$q.'</strong>';
    $final_name = str_ireplace($q, $b_name, $Name);
    ?>
    <div id="show">
        <span class="name"><?php echo $final_name; ?></span><br>
    </div>
<?php
}

jQuery中的ajax函数接收一个设置对象。在对象中，使用dataString传递数据属性。jQuery的ajax方法获取数据中的值，并通过后查询传递这些值。与其传递字符串，不如传递对象。

var dataString = 'bookNameInput='+ bookName;// OLD
var dataObject = {bookNameInput:bookName,bookIDinput:bookID}; //New

由于您使用的是keyup事件，它将一次触发一个输入，因此您需要去掉依赖关键字this检索数据的部分：

var bookName = $(this).val();//OLD
var bookID = $('#book').val();
var bookName = $('#bookName').val();