Question

我使用bootstrap 3并有一个按钮和输入。如果按钮被禁用，我想显示工具提示，如果提交按钮类型，则隐藏工具提示。在我的代码段.tooltip('hide')中，方法无效，我不知道原因。

HTML

    <div class=" user-attributes">
<input type="text" name="attrName" />

    <button type="submit" data-toggle="tooltip" title="Please select attribute name" class="btn btn-default disabled" name="addAttribute" >Add attribute</button>

    </div>

的javascript

    $('button[data-toggle="tooltip"]').tooltip({
    animated: 'fade',
    placement: 'bottom',
});
/* allow bootstrap tooltip for disabled buttons */
$('.user-attributes button[type="submit"]').css('pointer-events', 'auto');  

$( ".user-attributes [name='attrName']" ).bind('input', function(){
    var inputIsEmpty = $(this).val().length < 1;
    if (inputIsEmpty){
        $('.user-attributes button[type="submit"]').addClass('disabled');
        $('.user-attributes button[type="submit"]').removeAttr('type');
        $('.user-attributes button[type="submit"]').css('pointer-events', 'auto');
        $('button[data-toggle="tooltip"]').tooltip('show');
    } else {
        $('.user-attributes button[type="submit"]').removeClass('disabled');
        $('.user-attributes button[type="submit"]').removeAttr('style');
        $('.user-attributes button[type="submit"]').attr('type', 'submit');
        $('button[data-toggle="tooltip"]').tooltip('hide');
    }

});

Answer 1

.tooltip('destroy');帮了解。

jsfiddle

工具提示隐藏/显示在Bootstrap中不起作用

1 个答案: