-1

前段时间，我使用 JQuery 1.8.3 创建了一个 Balloon 插件。

当我从 JQuery 1.8.3 更新到 JQuery 1.9.1 时，我的插件停止工作。

气球不再显示。我回到 1.8.3 并且它有效。

我试图了解可能出了什么问题，但我找不到。

有人可以帮我吗？这是我的代码：

    (function ($) {
      $.fn.Balloon = function (options) {
    var defaults = {
          balloon: "",
          class: "Balloon",
          click: false,
          id: "Balloon",
          sensible: false,
          x: -4,
          y: -40
        };
        var options = $.extend({}, defaults, options);
        var balloon;
        $(this).each(function () {
          var title = $(this).attr("title");
          if (title == undefined) return;
          $(this).hover(function (e) {
            $(this).removeAttr("title")
            balloon = "<div id='{id}' class='{class}'><span class='Text'>{content}</span><span class='Background'></span></div>"
            if (options.balloon == "") {
              balloon = balloon.replace("{class}", options.class).replace("{id}", options.id).replace("{content}", title);
            } else {
              balloon = balloon.replace("{class}", options.class).replace("{id}", options.id).replace("{content}", options.balloon).replace("{title}", title);
            }
            $("body").append(balloon);
            $("#" + options.id).fadeIn("fast");
          },
          function () {
            $("#" + options.id).remove();
            $(this).attr("title", title);
          });
          $(this).mousedown(function (e) {
            if (options.click) {
              $("#" + options.id).remove();
              $(this).attr("title", title);
            }
          }),
          $(this).mousemove(function (e) {
            var x = e.pageX + options.x;
            var y = e.pageY + options.y;
            if (options.sensible) {
              var width = $("#" + options.id).width();
              var height = $("#" + options.id).height();
              var right = $(window).width() - (x + width);
              var bottom = $(window).height() - (y + height);
              if (right < 20) {
                x = e.pageX - width - options.x;
              }
              if (bottom < 20) {
                y = e.pageY - height - options.y;
              }
            }
            $("#" + options.id).css({ top: y, left: x });
          }); // Mouse Move
        }); // Balloon
      };
    })(jQuery);
4

3 回答 3

2

使用jQuery Migrate找出您需要为 jQuery 1.9 修复的内容。

此插件可用于检测和恢复在 jQuery 中已弃用并从 1.9 版开始删除的 API 或功能。有关插件生成的消息的更多信息，请参阅 警告页面。有关 jQuery 1.9 中所做更改的更多信息，请参阅升级指南和博客文章。

在您的网页中，在 jQuery 脚本之后加载此插件：

<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.1.1.js"></script>
于 2013-04-05T17:22:26.933 回答
0

你提到写一个插件。看看http://jquery.com/upgrade-guide/1.9/看看 jQuery 1.9 带来的变化。他们做了很多重大改变。

我会使用 jQuery Migrate 插件来识别问题，但不要在生产中使用它。你应该让你的插件与 jQuery 1.9+ 一起工作。

于 2013-04-05T17:24:36.117 回答
0

我能够通过以下方式替换悬停来解决它：

$(this).mouseenter(function (e) {
  // Code
}),
$(this).mouseleave(function (e) {
  // Code
});

谢谢你，米格尔

于 2013-04-05T18:30:59.930 回答