Question

我已经实施了Tooltip。虽然它确实有效，但如果我将鼠标悬停得太快，则工具提示不会消失。有没有办法确保工具提示隐藏鼠标或点击（适合移动设备）：

 // on mouse over, make a call to DB using AJAX and return results into tooltip
j$( '[data-toggle=tooltip]' ).on( 'mouseover', function( e ){
        var the_Tooltip = j$(this);
        e.preventDefault();
        var tour_ID = the_Tooltip.parent().find('.tour_ID').text();
        var tour_Date = the_Tooltip.parent().find('.tour_Date').text();
        var tour_Date_To = the_Tooltip.parent().find('.tour_Date-to').text();
        var data = {
          "action"    : "testing",
          "tour_ID"   : tour_ID,
          "tour_Date" : tour_Date,
          "tour_Date_To": tour_Date_To
        };
            j$.ajax( {
              url: '../include/vessel-count.php',
              dataType : 'json',
              type : 'POST',
              data: data,
              //cache: false,
              success : function( data ){
                j$(the_Tooltip).tooltip('hide').attr('data-original-title', data.vessel_Info).tooltip('fixTitle').tooltip('show');
                //console.log("returned date: "+data.vessel_Info);
              },
              error: function (request) {
                console.log(request.responseText);
                console.log(request["vessel_Info"]);
              }  
            } );//end ajax
    });

我尝试过添加，但没有运气：

j$( '[data-toggle=tooltip]' ).on( 'mouseout', function( e ){
    j$(this).tooltip('hide');
});

注意 - 当您将鼠标悬停在第一次工具提示时，它会保持运行状态。之后每次都按预期工作。

Answer 1

只需从“ $”符号中删除“ j”，您的代码即可使用。它对我有用。

$('[data-toggle=tooltip]' ).on( 'mouseout', function( e ){
    $(this).tooltip('hide');
});

工具提示 - 不会躲在鼠标外面

1 个答案: