Question

我正在修改jQuery自动完成功能，以便将第二个术语传递给搜索功能以缩小搜索范围。我遇到的问题是能够将城市连接到URL

$(function() {

    var city = $('#city').val();    //get the city value from text field
    var source = 'search.php?city=';  //URL where the search takes place
    //autocomplete
    $(".auto").autocomplete({
    source: source+city ,        //concatenation not working.
    minLength: 1
  });               

});

我尝试过不同的方法将城市名称连接到网址

$(function() {

    //var city = //$('#city').val();
    var source = 'search.php?city=';
    //autocomplete
    $(".auto").autocomplete({
    source: source+$('#city').val(),
    minLength: 1
  });               

});

我知道

var city = 'Austin'

的工作原理。

我不确定

$('#city').val()

因为如果我可以对它进行硬编码，那么同样适用于函数从文本字段中获取变量。正确？

文本字段是这样的

<form action='' method='post'>
    <p><label>Pharmacy Names : </label><input type='text' name='names' value='' class='auto'></p>
    <p><label>City : </label><input type='text' name='city' id='city' value='' placeholder='Enter City First'></p>
</form>

即使这篇文章Add form value to end of url - Jquery也同意我的想法

这篇文章Get the value in an input text box显示我正在使用正确的jquery调用来获取文本框值。它似乎应该工作，但事实并非如此。

Answer 1

您的脚本的行为是真的正确。发生了这种情况，因为初始化脚本时，city输入为空。

您应该附加事件处理程序到您的city输入，每当用户在其上键入内容时，更改您的source自动完成：

$(function() {

    // initialize the autocomplete
    var source = 'search.php?city=';

    $(".auto").autocomplete({
        source: source,
        minLength: 1
    });               

    // event handler for yout input
    $('#city').on('input', function (e) {
        var city = this.value;

        // set the new source to your autocomplete
        // based on jQuery UI Autocomplete
        // http://api.jqueryui.com/autocomplete/#method-option
        $('.auto').autocomplete( "option", "source", source+city);
    });

});

Answer 2

这对我来说能够使用两个文本框将两个变量传递给sql查询是有用的。

$(function() {
//Pharmacy autocomplete
$("#pharm").click(function() {
var city = $("#city").val();

var str = "../../library/ajax/pharmacy_autocomplete/search.php?city="+city;
    //autocomplete
    $(".pharmacy").autocomplete({
        source: str,
        minLength: 1
    }); 
  });
});

#pharm文本框是填写城市文本框后点击的位置。我把自动完成了这个函数，我没有把城市值传递给自动完成。现在我可以将城市值连接到URL并将第二个值传递给search.php。

自动完成不使用当前的jquery值

2 个答案: