Блог

Я создал инструмент javascript с помощью плагина beautytips, который использует beautytips для отображения меню параметров списка, к которому я затем привязываю действия.

Я начинаю с простого div для определения пунктов меню

 <div id="menu-div">
   <a href="javascript:;" id="link-one">text link one</a><br />
   <a href="javascript:;" id="link-two">text link two</a><br />
   <a href="javascript:;" id="link-three">text link three</a><br />
</div>
  

а затем создание экземпляра подсказки для красоты с помощью следующего кода:

     $("#menu-toggle").bt({
        contentSelector: "$('#menu-div').html()",
        preShow: function(box) {
        $("a[id^=link-]").click(function() {
           //do something
        });
    });
  

Я добавил функцию ‘preShow’, потому что по какой-то причине она не находила идентификаторы «link-» до тех пор, пока не был включен div .. (?). Это отлично работало в Firefox, safari и chrome, поскольку я мог щелкнуть меню-переключатель, просмотреть три ссылки, щелкнуть ссылку один и выполнить правильное действие первой ссылки и так далее.

Это работает нормально и в Internet Explorer, но только в первый раз. При повторном просмотре (щелкните, чтобы отобразить меню, перейдите по другой ссылке) Internet Explorer, похоже, не может найти те же идентификаторы.

Должен ли я отменить привязку функции после закрытия меню?

вот как beauty tips обрабатывает функцию предварительного показа:

 // trigger preShow function
// function receives the box element (the balloon wrapper div) as an argument
opts.preShow.apply(this, [$box[0]]);
  

Похоже, что в этом коде отсутствует фигурная скобка

 $("#menu-toggle").bt({
    contentSelector: "$('#menu-div').html()",
    preShow: function(box) {
      $("a[id^=link-]").click(function() {
        //do something
      });
    } // this curly brace was missing
});
  

Спасибо всем за предложения — я думаю, что я разобрался с этим, вернувшись к своему вопросу и поняв, что мне просто нужно найти способ каждый раз отключать обработчик событий, чтобы это работало в Internet Explorer. В BeautyTips есть обратный вызов после скрытия, который отлично работает для этого, поэтому я применил следующий код:

 postHide: function(box) { 
        $("a[id^=link-]").unbind();
    },
  

и это сработало, как ожидалось, во всех браузерах. Кто-нибудь знает хороший ресурс для понимания того, почему обработка событий будет работать так по-другому в Internet Explorer?