Question

我正在尝试将jasny bootstrap输入掩码应用于使用knockout数据绑定的文本输入。但是，在您单击输入框之前，数据掩码不会显示。我不确定为什么。我希望输入掩码立即显示出来。这是小提琴。 http://jsfiddle.net/LkqTU/31938/

这是html

<div class="container">
  <table class="table table-condensed  table-hover">
    <thead>
      <tr>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Phone</th>
      </tr>
    </thead>
    <tbody data-bind='foreach: employees'>
      <tr>
        <td data-bind='text: firstName'></td>
        <td data-bind='text: lastName'></td>
        <td>
          <input type="text" class="form-control" data-bind="value: phone" data-mask="999-999-9999">
        </td>
      </tr>
    </tbody>
  </table>
</div>

这是javascript。

function employee(firstName, lastName, phone) {
  this.firstName = ko.observable(firstName);
  this.lastName = ko.observable(lastName);
  this.phone = ko.observable(phone);

}

function model() {
  var self = this;
  this.employees = ko.observableArray("");
}

var mymodel = new model();

$(document).ready(function() {
  loaddata();
  ko.applyBindings(mymodel);
});

function loaddata() {
  mymodel.employees.push(new employee("Bob", "Jones", "7174569876"));
  mymodel.employees.push(new employee("Mary", "Smith", "3457892435"));
  mymodel.employees.push(new employee("Greg", "Black", "3557689800"));
}

Answer 1

在应用Knockout绑定后，尝试在文档加载时初始化输入掩码：

$(document).ready(function () {
    loaddata();
    ko.applyBindings(mymodel);
    $('.form-control').inputmask({
      mask: '999-999-9999'
    })
});

请务必同时删除数据掩码属性。

JS Fiddle example

在击倒负载上应用jasny输入掩码

1 个答案: