jQuery: как удалить всплывающую подсказку? - PullRequest
Новая
       7

jQuery: как удалить всплывающую подсказку?

14 голосов
/ 10 августа 2010

Я добавляю подсказку в div с классом .placeTaken. Затем пользователь может перетаскивать прямоугольники, поэтому я удаляю класс и вместо этого добавляю его в новый div. Когда это происходит, я добавляю новую всплывающую подсказку к этому элементу div, и она отлично работает, но я хочу удалить старую.

Они говорят, что если вы хотите удалить всплывающую подсказку, задав для атрибута title пустую строку, вместо этого установите атрибут original-title. Я попытался $("#"+dropFromId).attr("original-title", "");, но подсказка все еще там. Я даже не могу изменить заголовок всплывающей подсказки, установив другой заголовок оригинала.

Что я делаю не так?

Редактировать: Я думаю, я не дал вам достаточно информации, ребята. Я использую ajax, чтобы получить места, которые взяты из базы данных. PHP возвращает ассоциативный массив (клиенты), который я затем использую в своем JavaScript, где занимаемое место соответствует имени. Места, которые заняли, меняются при отбрасывании, поэтому я снова выполняю функцию ajax, чтобы обновить массив со всеми занятыми местами. В кулак я добавляю подсказку ко всем занятым местам, вот так 

$("#map div.placeTaken").tipsy({gravity: 'w', html: true, fade: true, title:
    function(){
        // id could for example be map74, substring to 74
        var id = $(this).attr("id").substring(3,6);
        return '<div>'+customers[id]+'</div><br />';
    }
});

Таким образом, заголовок равен тому, что соответствует этому месту в массиве. Я надеюсь, что я объясняю это достаточно хорошо. Когда ящик уронили на новое место, вот что происходит 

$("#map div span").bind( "dragstop", function(event, ui) {
        // some code here to change the .placeTaken class       
        // update database with the new place
        $.ajax({
            type: "POST",
            url: "map.php",
            data: "dropFromId="+ dropFromId.substring(3,6) +"& dropToId="+ dropToId.substring(3,6),
            success: function(){
            // ajax function to update the js array with new places
            customerTooltip(); 
            }
        });

        // on this place, add tooltip
        $("#"+dropToId).tipsy({gravity: 'w', html: true, fade: true, title:
            // funktion för att avgöra vilken title som ska användas
            function(){
                var id = dropToId.substring(3,6);
                return '<div>'+customers[id]+'</div><br />';
            }
        });
    }   
});

Это все работает нормально, поэтому я подумал, что я бы просто изменил заголовок dropFromId на "" в раскрывающемся списке, чтобы удалить его.

Ответы [ 9 ]

26 голосов
/ 01 февраля 2011

Использование $(".tipsy").remove();, похоже, помогает, так как div с классом tipsy добавляется в тело документа, когда отображается подсказка.

Просто убедитесь, что вы не используете класс tipsy в другом месте (то есть вместо этого назовите подсказку как toolTip)

11 голосов
/ 26 октября 2012

Самый простой способ удалить подвыпившие; 

$('.tipsy:last').remove();
6 голосов
/ 07 ноября 2012

Если вы не хотите, чтобы показывалось больше, просто используйте .tipsy('disable') на элементе.

Если вы используете trigger: manual и хотите скрыть его, вы можете просто удалить .tipsydiv на теле.

Там также disable enable и toggleEnabled

2 голосов
/ 10 августа 2010 
$("#"+dropFromId)[0].setAttribute('original-title', '')
1 голос
/ 10 декабря 2013

Проще всего им пользоваться: 

$('body').find('.tipsy').each(function(){
    $(this).remove();
});
1 голос
/ 27 октября 2010 
$("#tipsyfiedElement").unbind('mouseenter mouseleave'); // Or whatever event trigger the tiptool
0 голосов
/ 26 июня 2013

Я видел этот вопрос после поиска в Google ситуации отключения Tipsy на мобильном устройстве из-за сложностей с событием касания / нажатия, особенно на iPad.

Решением, которое я решил реализовать, было добавление небольшого тестав верхней части файла jquery.tipsy.js.

Чтобы отключить Tipsy на сенсорных (мобильных) устройствах: var deviceAgent = navigator.userAgent.toLowerCase (); 

var isTouchDevice = Modernizr.touch ||
(deviceAgent.match(/(iphone|ipod|ipad)/) ||
deviceAgent.match(/(android)/) ||
deviceAgent.match(/(iemobile)/) ||
deviceAgent.match(/iphone/i) ||
deviceAgent.match(/ipad/i) ||
deviceAgent.match(/ipod/i) ||
deviceAgent.match(/blackberry/i) ||
deviceAgent.match(/bada/i));

function Tipsy(element, options) {
    this.$element = $(element);
    this.options = options;
    this.enabled = !isTouchDevice;
    this.fixTitle();
};

См .: лучший способ определить, поддерживает ли пользовательский агент сенсорный

0 голосов
/ 27 февраля 2013

Использование: .unbind ('mouseenter mouseleave'); удалить пьяный метод.

0 голосов
/ 21 июля 2011

У меня недавно была эта проблема, вот как я ее решил:

Используйте это, чтобы установить для атрибута original-title значение 'stop': 

$('.myElement').attr('original-title','stop');

Затем в jquery.tipsy.js , измените код на следующий: 

...
} else if (typeof opts.title == 'function') {
    title = opts.title.call(this);
}

if (title != 'stop') {    //line 32
    ...
    ...
}                         //line 62
...

В моем выпуске (0.1.7) добавленный код начинается со строки 32 и заканчивается скобкой в ​​строке 62. Подсказка должна увидетьчто ваш атрибут title равен 'stop' и не будет пытаться открыть всплывающую подсказку.

Кроме того, это выдает некоторую ошибку консоли.Это не имеет никакого значения, но если вы хотите избавиться от этого, добавьте это в строку 73 (после добавления предыдущего кода) 

try { tip.remove(); } catch(err){}

POW

...