使用jQuery和Prototype的fadeIn()和fadeOut()方法时如何同时使用？

Question

我有一个网页需要更新，这个页面使用了Prototype和Lightbox。我不想将当前页面仅改为jQuery，因为我不确定还有哪些内容使用了Prototype，如果不再包含Prototype，其他内容可能会出现问题。

我的问题是：

我有几个TD，我想通过点击按钮来淡入淡出。当我暂时删除Prototype时，这个功能可以完美地工作。但一旦我重新加入Prototype，fadeOut() jQuery函数就会完全失效。我怀疑这是因为Prototype也有一个fadeIn()和fadeOut()函数。

有没有办法强制Prototype不将这些函数识别为它的函数，并且仍然让jQuery完美地执行它们？

以下是我的jQuery代码：

var $j = jQuery.noConflict();

$j(document).ready(function () {    
    $j("a.archiveBtn.2009").click(function () {
        $j("td.archive.2009").fadeIn();
        $j("tr td.archiveBtn").css("paddingBottom", 20);
        $j("tr td.archiveBtn").css("borderBottom", "#999 1px dashed");
        $j("a.hideArchive.2009").show();

        return false;
    });

    $j("a.hideArchive.2009").click(function () {
        $j("td.archive.2009").fadeOut(function () {
            $j("tr td.archiveBtn").css("paddingBottom", 0);
            $j("tr td.archiveBtn").css("borderBottom", "none");
        });
        $j(this).hide();

        return false;
    });

    $j("tr td.archiveBtn").parent().prev("tr").children("td").css("paddingBottom", 20);
});

任何帮助都将不胜感激，提前致谢。

- Anriëtte Myburgh

Answer 1

你似乎已经遵守了 jQuery 的冲突建议，也许尝试以下方法，它将在此处停用 Prototype 函数，但我真的不确定它是否能解决问题，因为我没有在你的代码中找到问题，但这值得一试：

jQuery(document).ready(function($) {
         $("a.archiveBtn.2009").click(function () {
 .....


}

通过这种方法，您可以直接使用$而不是$ j，并确保它仅为jQuery函数。 顺便问一下，您所说的彻底崩溃是什么意思？动画很奇怪吗？它根本没有淡化效果吗？

希望这可以帮助您，

祝您有美好的一天（听卡洛斯·让^^）

- Michael Lumbroso

---

我确定我也尝试过那个方法，但它仍然做同样的事情，它会淡出，但淡入却变得非常奇怪，之后淡出只显示其中一个td。当Prototype.js和jQuery同时激活时，动画就变得非常奇怪，但是使用相同的代码暂时禁用Prototype.js后，我的jQuery可以完美地工作。因此，怀疑Prototype在执行fadeIn()和fadeOut()函数时与jQuery一起尝试做某些事情。 - Anriëtte Myburgh

Answer 2

如果 jQuery 的 .animate 对你来说正常工作，那么你可以使用 .animate({opacity: 0}) 或 .animate({opacity: "hide"}) 来完成与 .fadeOut() 相同的操作。

- Jordan Stewart

---

谢谢，我不知道那个，下次我会看看的。 - Anriëtte Myburgh

Answer 3

最终，我确定Prototype.js只是为了让Lightbox工作而存在，所以我禁用了Prototype.js并集成了Lightbox jQuery插件。

现在我的代码完美运行。

- Anriëtte Myburgh