按钮工具提示的数据标题没有更新

data-title not getting updated on button tooltip

本文关键字:更新 标题 数据 工具提示 按钮      更新时间:2023-09-26

我有一个按钮,它的工具提示在启用/禁用时更新。但事实并非如此。这是js和html的绑定。当我使用init时,它不会,但当我使用update时,它会,但然后clickHandlers被调用多次。我正在使用knockout和bootstrap。

 <button class="btn btn-primary" type="button"
            id="displaySubmitBtn" data-bind="formSave: {text: isFormComplete() ? '' : missingRequiredTooltip, enable: isFormComplete, click: submitEstimateFromDisplay},
            text: bundle.submit_button_label, visible: isSubmitVisible"
            data-placement="bottom" data-backdrop="true">
    </button>

 ko.bindingHandlers.formSave = {
        init: function (el, valueAccessor) {
            var $el = $(el),
                saveEnabled = valueAccessor()['enable'],
                text = _.isFunction(valueAccessor()['text']) ? valueAccessor()['text']() : valueAccessor()['text'],
                placement = _.isString(valueAccessor()['placement']) ? valueAccessor()['placement'] : 'bottom',
                container = _.isString(valueAccessor()['container']) ? valueAccessor()['container'] : 'body',
                clickHandler = valueAccessor()['click'];
            var enabler = function (enabled) {
                //  not using $el.prop('disabled') on purpose so BS tooltip will show
                if (enabled) {
                    // enable the button
                    $el.removeClass('disabled');
                    $el.attr('data-title', undefined).tooltip('destroy');
                 }
                else {
                    $el.addClass('disabled');
                }
                $el.attr('data-title', text);
                $el.tooltip({
                    //title: text,
                    placement: placement,
                    container: container
                });
            };
            // call enabler to disable/ enable button and assign tooltip
            enabler(saveEnabled());
            // enabler listens to the computed method on button getting enabled/diabled
            saveEnabled.subscribe(enabler);
            $el.on("click", function (evt) {
                if (!$el.is('.disabled')) {
                    $el.attr('data-title', undefined).tooltip('destroy');
                    if(clickHandler) {
                        clickHandler(evt);
                    }
                }
                else {
                    evt.preventDefault();
                    return false;
                }
            });
        }
    };

您应该设置title属性,而不是data-title