将变量动态分配给jquery自动完成查询字符串

Question

我正在编写用户可以提交播放列表的表单。有一个“艺术家”领域和一个“歌曲”领域。两者都是输入类型“文本”。

我正在尝试在这两个字段中使用 jquery 的自动完成功能。艺术家的自动完成结果是用户击键的函数，歌曲的自动完成结果是用户击键和艺术家输入字段的值的函数。

自动完成似乎可以填充艺术家输入字段下的建议列表。 search.php 是读取查询字符串的脚本。

$(".artist").autocomplete("searchDev.php?type=artist&"+mydate.getTime(), {
    width: 180,
    selectFirst: false
});

在search.php 中，在a 击键后，searchDev.php 中 $_GET 的 var_export 产生

array (
  'type' => 'artist',
  1367531572213 => '',
  'q' => 'a',
  'limit' => '10',
 'timestamp' => '1367531576911',
)

这很好。 但是，当我尝试在自动完成（歌曲输入字段）中向查询字符串（此处为 window.sartist）提供 变量 时，

    $(".song").autocomplete("search.php?type=song&sartist="+window.sartist+"&"+mydate.getTime(),      {
    width: 180, 
    selectFirst: false
}); 

sartist 定义不正确，即 search.php 中的var_export($_GET) 产生

array (
  'type' => 'song',
  'sartist' => '[object HTMLInputElement]',
  1367525807081 => '',
  'q' => 'a',
  'limit' => '10',
  'timestamp' => '1367526169637',
)

如果使用未附加到窗口的全局变量代替查询字符串中的window.sartist，则var_export($_GET) 产生

array (
  'type' => 'song',
  'sartist' => '',
  1367528252501 => '',
  'q' => 'a',
  'limit' => '10',
  'timestamp' => '1367528260585',
)

所以我怀疑查询字符串加载后无法修改。有没有人有可行的解决方法来允许将变量动态分配给自动完成查询字符串？基本上我需要根据“艺术家”字段值的“歌曲”自动完成建议。

Answer 1

您只需要使用一个函数作为源将多个动态参数传递给查询：

$('.song').autocomplete({
   var value = $(this).val(); 
    source:function( request, response ) {
          $.getJSON( "searchDev.php", {
            term: value ,
              data:{
                  type:"song",
                  myparam:$('#myparam').val()
              }
          }, response );
   }
})

在本例中，如果当前输入 .song 的值为“high hope”且 #myparam 字段的值为“pink”，则查询将如下所示：searchDev.php?term=high+hope&type=song&myparam=pink

Fiddle（没有真正的数据源，只看控制台）：http://jsfiddle.net/RfuBP/3/ jquery 自动补全的源选项文档：http://api.jqueryui.com/autocomplete/#option-source

PS：在您的代码中，您确定 window.sartist 返回的是值而不是元素吗？