jQuery 除非连接插件，否则代码无法运行？

Question

对，所以我有两个不相关的问题： 1. 我遇到了一个在长段落中创建 "read more"/"read less" 按钮的代码。看起来很简单，我已经根据我的需要对其进行了调整...但出于某种原因，它只有在我 link 将页面添加到另一个外部 JS 插件时才有效！我的 HTML 被 link 编辑为 Jquery 和我自己设计的 JS，但是如果没有那个外部插件，这个代码将无法工作。问题是，那个插件是创建工具提示的 tooltipsy 插件，它与那段代码无关...... 来自同一 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 无法识别我站点中的本地 link（即我使用“/JS.js”来表示 JS 文件位于根文件夹中。Chrome 可以毫无问题地呈现它，而 FireFox 则没有）。知道这是为什么吗？

感谢您的帮助！

Answer 1

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

见：http://api.jquery.com/jquery.noconflict/

Answer 2

没有看到您包含的所有文件，我猜测您的代码正在使用 tooltipsy 插件包含的 jQuery 依赖项，因此当您包含该插件时它可以工作，但不是不工作时工作。

我会使用您浏览器的控制台视图来检查在您 enable/disable 插件时包含哪些脚本，哪些脚本未包含在内。

请记住，jquery 默认情况下并未附带所有组件。其中很多被打包到较小的包中，例如 UI 等。这可以解释为什么您的脚本失败，因为它缺少依赖项。

已将已转换的评论编辑为答案

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

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

关于问题 #2，尝试使用 ./js/ 作为路径。老实说，不要使用那样的硬编码链接，因为当您转换到实时服务器时，它可能会中断 :)

jQuery 除非连接插件，否则代码无法运行？

jQuery code not working unless a plugin is connected?

html

javascript

firefox

jquery