Bootstrap Maxlength插件

Question

我正在使用bootstrap maxlength插件源： http://mimo84.github.io/bootstrap-maxlength/

用于样式化maxlength属性的非常简洁的插件。 当我动态创建一个带有maxlength的新文本输入和纹理时，我现在遇到了问题。

创建之后，我用：

进行新的通话

     $('#newIdOfTextfield').maxlength();

但是没有激活插件。有没有人知道在哪里看，或者有答案？

我有一个订阅者功能，当我在功能中发出警报时，我会在屏幕上显示警报，因此在我向variabel字段添加内容后，它会调用该功能。

self.variableFields.subscribe(function(changes) {
    if (changes[0].status == 'added') {
        $('input[maxlength],textarea[maxlength]').maxlength({
            alwaysShow: true
        });
    }
}, null, 'arrayChange');

输出是这样的：

    <!-- ko foreach: variableFields -->

            <!-- ko if: fieldType == 'text' -->
            <div class="form-group">
              <label class="control-label col-lg-3 col-md-3" data-bind="text: fieldTitle"></label>
              <div class="col-lg-7 col-md-7">
                <input type="text" maxlength="150" class="form-control" placeholder="" data-bind="value: fieldValue">
              </div>
            </div>
            <!-- /ko -->

    <!-- /ko -->

对于静态字段，它很好，但是使用自动创建的字段，它可以使用动态添加的字段。

Answer 1

我认为执行的顺序不是你所期望的。我认为这种情况正在发生：

1. 您更新variableFields
2. 订阅者被称为＆amp; DOM开始呈现
3. 订阅者将首先执行。它尝试启动插件，但没有任何工作可用。
4. DOM更新 - 在订阅者之后！

您可以尝试使用foreach上的afterRender事件来修复它。像这样设置你的HTML：

<!-- ko foreach: {data: variableFields, afterRender: doPlugin} -->

然后在视图模型中添加一个名为doPlugin的方法，该方法设置新HTML中所需的所有插件：

self.doPlugin = function() {
    $('input[maxlength],textarea[maxlength]').maxlength({
        alwaysShow: true
    });
}

这将如下工作：

1. 您更新variableFields
2. DOM开始呈现
3. DOM已更新且afterRender触发
4. doPlugin被称为
5. 您的代码现在有一些有效的DOM元素可用于