2

我想从Boostrap制作工具提示，当输入选择已选择已选择时，请在Element HTML中显示ToolTip。我已经在 javascipt/jquery 中编写了该代码。这是代码：

    $('#pembayaran').on('change', function(){
        if($(this).val()=='GRATIS' && $('#keterangan').val()==''){
            $('#keterangan').attr('title', 'Keterangan wajib disi!').tooltip('show');
        }
    });

我想在右侧制作工具提示位置。

我尝试代码

    $('#pembayaran').on('change', function(){
        if($(this).val()=='GRATIS' && $('#keterangan').val()==''){
            $('#keterangan').attr('title', 'Keterangan wajib disi!').tooltip('show', {
               placement: 'right'
            });
        }
    });

但这段代码不起作用。你能帮助我吗。请

4

4 回答 4

6

引导插件方法采用一个参数，而不是两个。此方法调用：

$('#keterangan').attr('title', 'Keterangan wajib disi!').tooltip('show', {
    placement: 'right'
});

是不正确的。相反，您应该保持原来的 on change 功能，并调用：

$('#keterangan').tooltip({ placement: 'right' });

更早地设置工具提示选项（例如文档准备就绪时）。

另一种可能更简单的替代方法是添加data-position="right"到显示弹出窗口的元素中。

于 2013-02-26T03:03:30.217 回答
3

在 html 中：

<a href="sample.html" data-placement="right" rel="tooltip" title="This is a tooltip">Hover me!</a>

在jQuery中：

$(function(){
    $("[rel='tooltip']").tooltip();
});
于 2013-03-07T07:35:48.763 回答
2

这对我有用

    $('.mytooltip').tooltip('destroy');
    $('.mytooltip').tooltip({ placement: 'right' });
于 2016-04-07T11:52:34.267 回答
0

对于我的情况，我需要根据屏幕尺寸更改工具提示的位置，作为一种解决方案，我会监听分辨率更改事件，然后在事件处理程序中我销毁旧的工具提示并添加一个新的工具提示，其位置根据新的宽度尺寸：

$(document).ready(function() {
    var enablePasswordTooltip = function() {
        var passwordTooltipContent = $('#PasswordTooltipContent').html();
        var isMobileResolution =  ($(window).width() < 700);
        $('input.password-tooltip').tooltip({
            'trigger': 'focus',
            'placement': isMobileResolution ? 'top' : 'right',
            'html': true,
            'title': passwordTooltipContent
        });
    };

    // Enable the Password tooltip when the page is loaded
    enablePasswordTooltip();

    $(window).resize(function() {
        // After the resolution changes, destroy the tooltip and add it again in order to adjust to the new resolution
        $('input.password-tooltip').tooltip('destroy'); 
        setTimeout(function(){
            enablePasswordTooltip();
        }) 
    });
});
于 2019-07-30T21:00:38.250 回答