Jquery Conflict给出了错误 [英] Jquery Conflict which gives error

查看:93
本文介绍了Jquery Conflict给出了错误的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

处理具有各种功能的项目,例如

Working on an project which has variety of functionality in it such as,


  • Google翻译

  • Image Slider [使用galleriffic]

  • 弹出窗口[使用阴影框]

  • JavaScript水平菜单栏*

  • Google translator
  • Image Slider [galleriffic used]
  • Popup window [Shadow box used]
  • JavaScript horizontal menu bar*

现在我们在其中遇到jquery冲突和错误消息,例如

我知道当代码找不到jquery时会出现这样的消息文件,但文件存在。

以下是项目中使用的文件列表
这是谷歌翻译所需要的

Here are the list of files used in the project This is needed by the google translator

    1.<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    2. <script type="text/javascript" src="//jquery-translate.googlecode.com/files/jquery.translate-1.3.7.min.js"></script>
    3. <script type="text/javascript" src="/scripts/jQuery/jquery.cookie.js"></script>
    4.  <script type="text/javascript" src="/scripts/jquery.bt.js"></script>
    5. <script type="text/javascript" src="/scripts/jquery-ui-1.8.21.custom.min.js"></script>
    6. <script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js"></script>
    7. <script type="text/javascript" src="/scripts/common.js"></script>

这个是滑块

    1.  <script type="text/javascript" src="/SliderBox/js/jquery-1.3.2.js"></script>
    2.  <script type="text/javascript" src="/SliderBox/js/jquery.galleriffic.js"></script>
    3.  <script type="text/javascript" src="/SliderBox/js/jquery.opacityrollover.js"></script>

这是针对弹出窗口的

    1. <script type="text/javascript" src="/SliderBox/js/prototype.js"></script>
    2. <script type="text/javascript" src="/SliderBox/js/effects.js"></script>
    3. <script type="text/javascript" src="/SliderBox/js/lightwindow.js"></script>
    4. <script type="text/javascript" src="/SliderBox/shadowbox/shadowbox.js"></script>

横向菜单需要这样做

    1. <script type="text/javascript" src="./jquery-1.9.1.min.js"></script>
    2. <script src="../scripts/jquery.als-1.1.min.js" type="text/javascript"></script>
    3. <script src="../scripts/settingsEN.js" type="text/javascript"></script>

我已经优化了所有这些并且只包含了一个jquery-1.9.1的jquery文件.min.js
但仍无法清除冲突
以下是我使用的序列

    1. <script type="text/javascript" src="./jquery-1.9.1.min.js"></script>
    2.<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    3. <script type="text/javascript" src="//jquery-translate.googlecode.com/files/jquery.translate-1.3.7.min.js"></script>
    4. <script type="text/javascript" src="/scripts/jQuery/jquery.cookie.js"></script>
    5.  <script type="text/javascript" src="/scripts/jquery.bt.js"></script>
    6. <script type="text/javascript" src="/scripts/jquery-ui-1.8.21.custom.min.js"></script>
    7. <script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js"></script>
    8. <script type="text/javascript" src="/scripts/common.js"></script>
    9. <script type="text/javascript" src="/SliderBox/js/jquery.galleriffic.js"></script>
    10.  <script type="text/javascript" src="/SliderBox/js/jquery.opacityrollover.js"></script>
    11.<script type="text/javascript" src="/SliderBox/js/prototype.js"></script>
    12. <script type="text/javascript" src="/SliderBox/js/effects.js"></script>
    13. <script type="text/javascript" src="/SliderBox/js/lightwindow.js"></script>
    14. <script type="text/javascript" src="/SliderBox/shadowbox/shadowbox.js"></script>
    15.<script src="../scripts/jquery.als-1.1.min.js" type="text/javascript"></script>
    16. <script src="../scripts/settingsEN.js" type="text/javascript"></script>

我已尝试过所有这些

< a href =http://api.jquery.com/jQuery.noConflict/ =nofollow noreferrer> http://api.jquery.com/jQuery.noConflict/

http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/?rdfrom = http%3A%2F%2Fdocs.jquery.com%2Fmw%2Findex.php%3Ftitle%3DUsing_jQuery_with_Other_Libraries%26redirect%3Dno

http://www.w3schools.com/jquery/jquery_noconflict.asp

我已经尝试了所有这些

 <script type="text/javascript" src="other_lib.js"></script>
 <script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript">
 $.noConflict();
 // Code that uses other library's $ can follow here.
 </script>

 <script type="text/javascript" src="other_lib.js"></script>
 <script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript">
 $.noConflict();
 jQuery(document).ready(function($) {
 // Code that uses jQuery's $ can follow here.
  });
 // Code that uses other library's $ can follow here.
 </script>

jQuery.noConflict();
(function($) {
 $(function() {
  // more code using $ as alias to jQuery
 });
})(jQuery);
// other code using $ as an alias to the other library

但仍然无法使用得到解决方案

but still not able to get the Solution

当我删除这个滑块代码时,每件事都运行正常,没有错误但滑块不起作用

When I remove this code of slider, every thing works fine , no errors but the slider will not work

 <!--script for slider--->

      <script type="text/javascript">

  jQuery(document).ready(function($) {
    // We only want these styles applied when javascript is enabled
    $('div.navigation').css({'width' : '', 'float' : 'right'});
    $('div.content').css('display', 'block');

    // Initially set opacity on thumbs and add
    // additional styling for hover effect on thumbs
    var onMouseOutOpacity = 0.67;
    $('#thumbs ul.thumbs li').opacityrollover({
      mouseOutOpacity:   onMouseOutOpacity,
      mouseOverOpacity:  1.0,
      fadeSpeed:         'fast',
      exemptionSelector: '.selected'
    });

    // Initialize Advanced Galleriffic Gallery
    var gallery = $('#thumbs').galleriffic({
      delay:                     2500,
      numThumbs:                 15,
      preloadAhead:              10,
      enableTopPager:            true,
      enableBottomPager:         true,
      maxPagesToShow:            7,
      imageContainerSel:         '#slideshow',
      controlsContainerSel:      '#controls',
      captionContainerSel:       '#caption',
      loadingContainerSel:       '#loading',
      renderSSControls:          true,
      renderNavControls:         true,
      random:                    true,
      prevLinkText:              '',
      nextLinkText:              '',
      nextPageLinkText:          '',
      playLinkText:              '',
      pauseLinkText:             '',
      prevPageLinkText:          '',
      enableHistory:             false,
      autoStart:                 false,
      syncTransitions:           true,
      defaultTransitionDuration: 900,
      onSlideChange:             function(prevIndex, nextIndex) {
        // 'this' refers to the gallery, which is an extension of $('#thumbs')
        this.find('ul.thumbs').children()
          .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
          .eq(nextIndex).fadeTo('fast', 1.0);
      },
      onPageTransitionOut:       function(callback) {
        this.fadeTo('fast', 0.0, callback);
      },
      onPageTransitionIn:        function() {
        this.fadeTo('fast', 1.0);
      }
    });
  });
</script>



  <!--script end--->

任何人都可以帮忙吗?

推荐答案

我选择了这个流程并且错误已经解决了。 不需要任何.noConflict()和!!!

1)<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
2)<script type="text/javascript" src="//jquery-translate.googlecode.com/files/jquery.translate-1.3.7.min.js"></script>
3)<script type="text/javascript" src="/scripts/jQuery/jquery.cookie.js"></script>
4)<script type="text/javascript" src="/scripts/jquery.bt.js"></script>
5)<script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js"></script>
6)<script type="text/javascript" src="/scripts/common.js"></script>
7)<script src="/scripts/jQuery/insert_active_flash.js" type="text/javascript"></script>
8)<script type="text/javascript" src="/SliderBox/js/jquery.galleriffic.js"></script>
9)<script type="text/javascript" src="/SliderBox/js/jquery.opacityrollover.js"></script>
10)<script type="text/javascript" src="/SliderBox/shadowbox/shadowbox.js"></script>
11)<script type="text/javascript" src="/scripts/jquery.als-1.1.min.js"></script>
12)<script type="text/javascript" src="/scripts/settingsEN.js"></script>

与prototype.js发生冲突的缩小版本javascript。我刚删除了prototype.js文件并按顺序排列了所有参考文件[序列很重要]

The minified version javascript where having conflict with prototype.js. I just removed the prototype.js file and arranged all reference file in sequence [Sequence matters a lot]

现在错误是删除我仍然想知道prototype.js ???

这篇关于Jquery Conflict给出了错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆