3

我有一个现有的事件重页，我正在尝试添加预先输入支持。typeahead 功能按需要工作，只是它似乎只能附加到输入项一次。

问题在于，为简单起见，在某些操作之后，现有页面会删除所有附加到特定输入的事件 $('input').off()，然后根据新上下文重新附加新的事件处理程序。

这会导致一个问题，即重新附加的 typeahead 函数似乎永远不会触发。（这里讨论了一个类似但不同的问题：Trouble updated Bootstrap's typeahead data-source with post response但这在这里不相关，因为我可以很好地更新源 - 我无论如何都无法触发 type-ahead我尝试什么）

编辑：为了澄清 - 更改源（如链接的问题）不是问题 - 实际页面上的源是向服务器发出请求的 js 函数。问题是调用.off()似乎会永久中断预先输入，并且我无法删除调用.off()而不必重写大部分页面......下面的代码和 jsfiddle 只是我可以设计的最短的代码来演示这个问题

这里有一个有效的 jsfiddle 记录问题：http: //jsfiddle.net/hz5P3/8/

为了将来参考，完整的代码如下。简要记录一下：input.workstext_field 只有一个 typeahead 声明并且工作正常。input.no_works调用了 typeahead 函数，然后调用$('.no_works').off()以删除此输入上的所有事件。重新附加到此功能的 typeahead 根本无法正常工作。

有什么方法可以使第二次提前输入的调用按预期工作？

谢谢

html

<div class="container">
    <div class="hero-unit">
        <h1>Bootstrap jsFiddle Skeleton</h1>
        
         <p>this is a test typeahead that will work</p>         
        <input type="text" class="works" style="margin: 0 auto;">
        
        <p>this is a test typeahead that is updated and will not work</p>
        <input type="text" class="no_works" style="margin: 0 auto;">
    </div>
</diV>​

Javascript 

$('.no_works').typeahead({
  source: ["cat", "dog", "mouse"]
});
$('.no_works').off();

$('.no_works').typeahead({
  source: ["cat", "dog", "mouse"]
});

$('.works').typeahead({
  source: ["cat", "dog", "mouse"]
});

​</p>

4

1 回答 1

7

编辑：好的，我现在明白了。

因此，您需要从该元素的 jQuery 对象中清除“typeahead”数据。这可能不是 100% 正确的方法，但它很容易并且有效：

http://jsfiddle.net/feXM3/

$('.no_works').typeahead({
  source: ["cat", "dog", "mouse"]
});

$('.no_works').off();

//amir75 added a line here:
$('.no_works').data('typeahead', (data = null))

$('.no_works').typeahead({
  source: ["frog", "cow", "horse"]
});

我最初的回答： 我不认为“关闭”方法会像您期望的那样删除旧的提前输入功能。

你可以这样做：

//1. store the typeahead object in a variable
var tah= $('.no_works').typeahead({
  source: ["cat", "dog", "mouse"]
});

//2. update the data source
tah.data('typeahead').source = ["frog", "cow", "horse"];

更新了 jsfiddle：http: //jsfiddle.net/Skp5R/

于 2012-09-05T00:00:35.300 回答