Question

Knockout值绑定不适用于jquery autocomplte。如何让它运作？

我有一个模板：

<input 
   type="text" 
   class="autocomplete" 
   data-bind="value: viewModelObservableValue"
   name="MyValue" />

模板渲染后，我在输入上应用jQuery自动完成。绑定不起作用。查看我的jsfiddle。

仅当ko.applyBindings(viewModel)跟在$(..).autocomplete(..);

之后才有效

Answer 1

看起来jQuery自动完成程序劫持了change事件。这就是为什么它不起作用。

要解决此问题，您必须将valueUpdate属性设置为blur。当然，选择项目后不会触发，你必须先模糊。

$(function() {
    var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Scheme"
    ];
    $(".autocomplete").autocomplete({
      source: availableTags
    });
 });

var viewModel = {
    myValue: ko.observable()
};

ko.applyBindings(viewModel);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script>

<input type="text" class="autocomplete" data-bind="value: myValue, valueUpdate:'blur' " />

<div data-bind="text: myValue"></div>

Knockout和jQuery自动完成

1 个答案: