Question

是的，所以我有两个无关的问题：我遇到了一个代码，用于在长篇图章中创建“阅读更多”/“少阅读”按钮。这看起来很简单，我已根据我的需要对其进行了调整......但出于某种原因，只有将页面链接到另一个外部JS插件才有效！我的HTML链接到Jquery和我自己设计的JS，但如果没有该外部插件，这一个代码将无法运行。问题是，该插件是用于创建工具提示的工具提示插件，它与该段代码无关...... 来自相同JS和Jquery函数的所有其他代码都可以完美地工作，除了那个，它与工具提示插件完美配合。完全相同的代码：

var showChar = 200; 
var moretext = "...read more";
var lesstext = "...read less"; 
$(".more").each(function () {
    var content = $(this).html(); 
    if (content.length > showChar) { 

        var c = content.substr(0, showChar); 
        var h = content.substr(showChar, content.length - showChar); 
        var html = c + '<span class="morecontent"><span>' + h + '</span>  <a href="" class="morelink">' + moretext + '</a></span>'; 

        $(this).html(html); 
    }

});

$(".morelink").click(function () { 
    if ($(this).hasClass("less")) {
        $(this).removeClass("less");
        $(this).html(moretext); 
    } else {
        $(this).addClass("less");
        $(this).html(lesstext); 
    }
    $(this).parent().prev().toggle(); 
    $(this).prev().toggle();
    return false;
}); //End of code for toggeling more or less text.

我尝试在JSFiddle中添加一个示例，但由于整个事情依赖于我的计算机上的外部媒体（背景图片，字体等），因此它无法正确显示。

由于某种原因，FireFox无法识别我站点中的本地链接（即我使用“/JS.js”来表示JS文件位于根文件夹中.Chrome提供它没有问题，FireFox没有）。知道为什么会这样吗？

Thanx的帮助！

Answer 1

如果没有看到你所包含的所有文件，我的猜测是你的代码使用了工具提示插件所包含的jQuery依赖项，因此当你包含插件时它为什么会工作，但是当它没有时却没有工作。

我使用浏览器的控制台视图来检查哪些脚本是什么，并且在启用/禁用插件时不包含这些脚本。

请记住，默认情况下，jquery并没有附带所有组件。其中很多包装在较小的包中，例如UI等。这可以解释为什么你的脚本失败了，因为它缺少一个依赖。

编辑转换后的评论以回答

toggle（）命令是jquery ui的一部分，如上所述，它是jquery的外部组件。您可以轻松地自己挂钩jquery，这将解决您的问题。您需要在加载jquery之后加载组件，并且可以像加载jquery库一样完成。

参考：http://api.jquery.com/toggle/

对于问题＃2，尝试使用./js/作为路径。老实说，不要使用这样的硬编码链接，因为当你转换到实时服务器时，它可能会破坏：）

Answer 2

我认为你有冲突。当另一个lib使用$ variable时会发生这种情况。

请参阅：http://api.jquery.com/jquery.noconflict/

除非连接插件，否则jQuery代码无法正常工作？

2 个答案: