0

我正在尝试实现我在 CodeCanyon 上购买的名为 Textify 的 jQuery 插件。

Textify 需要 jQuery,我正在使用 Shape5 的 Vertex 框架在 Joomla 2.5 环境中实现这个插件。

将插件集成到站点后,我收到 5 个“'undefined' is not a function”错误。

开发站点位于http://sosdivorce.ergonomiq.net

由于 Textify 是一个商业产品,我不喜欢在网上发布脚本。

我得到的具体错误如下:

Error in file: http://sosdivorce.ergonomiq.net/templates/shape5_vertex/js/multibox/overlay.js

    Type Issue
    'undefined' is not a function (evaluating '$(window).addEvent('resize',function(){s5_resize_overlay();});')

Error in file: http://sosdivorce.ergonomiq.net/templates/shape5_vertex/js/s5_info_slide.js

    Type Issue
    'undefined' is not a function (evaluating '$(window).addEvent('resize',function(){s5_is_tobind();});')

Error in file: http://sosdivorce.ergonomiq.net/templates/shape5_vertex/js/s5_responsive_mobile_bar.js

    Type Issue
    'undefined' is not a function (evaluating '$(window).addEvent('resize',s5_responsive_mobile_login_register);')

Error in file: http://sosdivorce.ergonomiq.net/templates/shape5_vertex/js/s5_columns_equalizer.js

    Type Issue
    'undefined' is not a function (evaluating '$(window).addEvent('resize',s5_load_resize_columns);')

Error in file: http://sosdivorce.ergonomiq.net/templates/shape5_vertex/js/s5_flex_menu.js

    Type Issue
    'undefined' is not a function (evaluating '$(this.options.id).getElements('li, span.grouped_sub_parent_item');')

我该如何调查这个?

4

3 回答 3

3

jQuery 和 Mootools 都使用 $ 符号作为库的快捷方式。我的建议是查看您的 jquery 代码并替换 $ 变量,看看是否有所作为。因此,例如,您可以在调用 jquery 库后立即完全禁用 jQuery 的 $ 别名

// Disable the $ global alias completely
jQuery.noConflict();

然后对于 jQuery 脚本使用

(function($){

// set a local $ variable only available in this block as an alias to jQuery
... here is your jQuery specific code ...

})(jQuery);

为了安全起见,我也会对你的 mootools 脚本做同样的事情:

(function($){

// set a local $ variable only available in this block as an alias 
// to Mootools document.id
... here is your Mootools specific code ...

})(document.id);

当您托管这些时,您可能需要将它们添加到您的脚本中。


编辑:

以您所做的方式编辑脚本没有任何问题。实际上最好的做法是在设计插件时考虑到 Joomla noConflict()!

CDN 托管确实使事情变得更加复杂,通常你会以这样的方式添加 jQuery

<script src="PATH TO GOOGLE ETC" type="text/javascript" />
<script type="text/javascript">
    jQuery.noConflict();
</script>
<script src="PATH TO SCRIPTS" type="text/javascript" />

在 joomla 网站上的问题是 joomla 将首先加载所有文件脚本,然后添加手写脚本。无论您添加它们的顺序是什么。即它会像加载它们一样加载它们

<script src="PATH TO GOOGLE ETC" type="text/javascript" />
<script src="PATH TO SCRIPTS" type="text/javascript" />
<script type="text/javascript">
    jQuery.noConflict();
</script>

即使它们以相反的方式插入!因此,我建议将其插入到 jQuery 文件本身中的方式有​​点丑陋且编码不太好。我建议在本地托管 jQuery 文件。这不是有史以来最漂亮的方法——也不是最理想的方法,但它是我在 Joomla 中知道的唯一解决这个烦人事实的方法。但是,如果您可以在jQuery.noConflict();加载 jQuery 插件之前手动添加 jQuery 下方的 in - 这是一个更好的方法

于 2012-11-05T15:03:52.803 回答
0

您是否尝试过使用jQuery.moConflict(); 以下内容:

<script>

      jQuery.noConflict();

// Use jQuery via jQuery(...)

      // Use Prototype/Mootools with $(...), etc.

    </script>
于 2012-11-05T14:49:36.257 回答
0

我所做的是,我在头文件的包含文件中替换了以下代码:

<!-- jQuery Scripts -->
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>

<!-- Textify Scripts -->
<script type="text/javascript" src="<?php echo $s5_directory_path ?>/js/textify-min.js"></script>  
<script type="text/javascript">  
    $(document).ready(function (){    
      //Usage  
      $(".longText").textify();     
    });   
</script>

使用此代码:

<!-- jQuery Scripts -->
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
    jQuery.noConflict();
</script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>

<!-- Textify Scripts -->
<script type="text/javascript" src="<?php echo $s5_directory_path ?>/js/textify-min.js"></script>  
<script type="text/javascript">  
    jQuery(document).ready(function (){    
      //Usage  
      jQuery(".longText").textify();     
    });   
</script>

乔治,你说我应该加上

(function($){

在顶部和

})(jQuery);

在每个 jQuery 插件的底部,我应该添加

jQuery.noConflict();

在主 jQuery 文件的底部。

我所做的似乎有效,但也许这不是做事的最佳实践方式。

还有,怎么加

jQuery.noConflict();

到 CDN 托管的 jQuery 副本?

于 2012-11-05T16:40:47.387 回答