Question

我的typeahead元素有一些数据属性，用于定义要发送到我的服务的url，字段和其他参数。

我正在尝试在源函数中访问这些数据属性，但没有运气。

我的typeahead元素定义如下：

<input class="typeahead" type="text" data-url="some_url.json">

我初始化typeahead的javascript是这样的：

$("body").find('.typeahead').typeahead(null, {
    displayKey: 'name',
    source: getSource()        
})  

function getSource(){
    var my_url = ???????

    return new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.whitespace,
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        remote: {
                url: my_url,
                wildcard: '%QUERY'
              }
        });
}

“getSource”函数中的“this”变量指向“window”。还有另一种方法可以做到这一点，或者我需要为每种类型的类型定义一个初始化吗？

感谢。

Answer 1

我在激活之前简单地遍历typeahead元素：

$(".typeahead").each(function(){
    var url = $(this).data("url");
    $(this).typeahead(...);
  })

Answer 2

您可以初始化空的预先输入并使用＆＃34; typeahead：active＆＃34;事件初始化： $（＆＃34;选择器＆＃34）。预输入（） .on（＆＃34; typeahead：active＆＃34;，function（）{ var url = $（this）.data（＆＃34; url＆＃34;）;

      //destroy old typeahead
      $(this).unbind("typeahead:active"); 
      $(this).typeahead("destroy");

      //reconstruct typeahead again
      $(this).typeahead(null,
          {
            displayKey: xxx,
            source: url
          });
  }

请记住，当你＆＃34;销毁＆＃34;你的控制，它回滚到原始元素。所以有些东西可能会丢失，就像焦点一样。

另一个问题是此事件将在新控件中再次触发。所以你需要解开这个事件。

使用数据短划线属性初始化预先输入源

2 个答案: