knockout为绑定元素生成id

Posted 2020-12-24 lucika

knockout 提供生成了uniqueName的方法，但没有提供生成Id的方法。

感谢stackoverflow提供的思路与方法。

下面是uniqueName的实现方法。

ko.bindingHandlers[‘uniqueName‘] = {
    ‘init‘: function (element, valueAccessor) {
        if (valueAccessor()) {
            element.name = "ko_unique_" + (++ko.bindingHandlers[‘uniqueName‘].currentIndex);

            // Workaround IE 6 issue - http://www.matts411.com/post/setting_the_name_attribute_in_ie_dom/
            if (ko.utils.isIe6)
                element.mergeAttributes(document.createElement("<input name=‘" + element.name + "‘/>"), false);
        }
    }
};
ko.bindingHandlers[‘uniqueName‘].currentIndex = 0;

绑定

<input type="checkbox"  data-bind="uniqueName:true" />

对于Id

ko.bindingHandlers[‘uniqueId‘] = {
                ‘init‘: function (element, valueAccessor) {
                    if (valueAccessor()) {
                        element.id = "ko_unique_" + (++ko.bindingHandlers[‘uniqueId‘].currentIndex);
                    }
                }
            };

<input type="checkbox"  data-bind="uniqueId:true" />

对于label的for属性

ko.bindingHandlers[‘foruniqueId‘] = {
                ‘init‘: function (element, valueAccessor) {
                    if (valueAccessor()) {
                        element.setAttribute(‘for‘, "ko_unique_" + (++ko.bindingHandlers[‘foruniqueId‘].currentIndex));
                    }
                }
            };

html元素

<label data-bind="foruniqueId:true" ></label>