Question

我正在使用AJAX live search插件。
它将输入数据传递给backend-search.php
backend-search.php从数据库中选择数据并返回搜索页面现在我想用搜索查询传递一个隐藏的输入值。

隐藏输入

＆＃13;

<input type="hidden" name="group" value="<?php echo $grp_id; ?>" />

＆＃13;

以下是search.php

中的html

＆＃13;

<div class="search-box">
   <input type="text" autocomplete="off" placeholder="Search..." />    
<div class="result"></div>

＆＃13;

Javascript

＆＃13;

<script type="text/javascript">
$(document).ready(function(){
    $('.search-box input[type="text"]').on("keyup input", function(){
        /* Get input value on change */
        var term = $(this).val();
        var resultDropdown = $(this).siblings(".result");
        if(term.length){
            $.get("backend-search.php", {query: term}).done(function(data){
                // Display the returned data in browser
                resultDropdown.html(data);
            });
        } else{
            resultDropdown.empty();
        }
    });
    // Set search input value on click of result item
    $(document).on("click", ".result p", function(){
        $(this).parents(".search-box").find('input[type="text"]').val($(this).text());
        $(this).parent(".result").empty();
    });
});
</script>

＆＃13;

如何使用上面的js发送隐藏输入字段的数据？

Answer 1

您可以使用$.post代替$.get，如下所示：

$.post( "backend-search.php?query="+ term, { hidden_key: "hidden_value"})
.done(function(data) {
    alert( "Data Loaded: " + data );
});

所以，为你的代码定制它，

if(term.length) {
    // get value of hidden field
    var hidden_value = $('[name="group"]').value(); 
    // make a post request, but also pass query params 
    $.post("backend-search.php?query=" + term, { group: hidden_value})
       .done(function(data){
           // Display the returned data in browser
           resultDropdown.html(data);
        });
    }

这里，?标记之后的所有内容都作为查询字符串传递（即通过get方法），而隐藏字段则由Post方法传递。在您的Php脚本中，使用print_r($_REQUEST)验证您是否获得了所需的2个参数。

此外，您应该像这样encodeURIComponent(term)对URI参数进行编码，以确保在用户输入特殊字符时您的javascript不会中断

使用AJAX

1 个答案: