2014-08-27 105 views
-3

我有一個問題,當我刪除下面的代碼,視頻播放器彈出式播放器工作,但我的聯繫表格doesnt。Javascript和jQuery的衝突

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 

我加入的腳本沒有衝突,但它仍然現在的工作,這裏有我的JS和jQuery碼這是在頭標記。任何幫助將不勝感激。

<script type="text/javascript" src="lib/jquery-1.8.2.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 

<script type="text/javascript"> 
    var j = jQuery.noConflict(); 
</script> 

<!-- Add fancyBox main JS and CSS files --> 
<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.3"></script> 
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.2" media="screen" /> 

<script src="http://jwpsrv.com/library/WDP87vS0EeKnIhIxOUCPzg.js"></script> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     /* 
     * Simple image gallery. Uses default settings 
     */ 

     $('.fancybox').fancybox(); 

     /* 
     * Different effects 
     */ 

     // Change title type, overlay closing speed 
     $(".fancybox-effects-a").fancybox({ 
      helpers: { 
       title : { 
        type : 'outside' 
       }, 
       overlay : { 
        speedOut : 0 
       } 
      } 
     }); 

     // Disable opening and closing animations, change title type 
     $(".fancybox-effects-b").fancybox({ 
      openEffect : 'none', 
      closeEffect : 'none', 

      helpers : { 
       title : { 
        type : 'over' 
       } 
      } 
     }); 

     // Set custom style, close if clicked, change title type and overlay color 
     $(".fancybox-effects-c").fancybox({ 
      wrapCSS : 'fancybox-custom', 
      closeClick : true, 

      openEffect : 'none', 

      helpers : { 
       title : { 
        type : 'inside' 
       }, 
       overlay : { 
        css : { 
         'background' : 'rgba(238,238,238,0.85)' 
        } 
       } 
      } 
     }); 

     // Remove padding, set opening and closing animations, close if clicked and disable overlay 
     $(".fancybox-effects-d").fancybox({ 
      padding: 0, 

      openEffect : 'elastic', 
      openSpeed : 150, 

      closeEffect : 'elastic', 
      closeSpeed : 150, 

      closeClick : true, 

      helpers : { 
       overlay : null 
      } 
     }); 

     /* 
     * Button helper. Disable animations, hide close button, change title type and content 
     */ 

     $('.fancybox-buttons').fancybox({ 
      openEffect : 'none', 
      closeEffect : 'none', 

      prevEffect : 'none', 
      nextEffect : 'none', 

      closeBtn : false, 

      helpers : { 
       title : { 
        type : 'inside' 
       }, 
       buttons : {} 
      }, 

      afterLoad : function() { 
       this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : ''); 
      } 
     }); 


     /* 
     * Thumbnail helper. Disable animations, hide close button, arrows and slide to next gallery item if clicked 
     */ 

     $('.fancybox-thumbs').fancybox({ 
      prevEffect : 'none', 
      nextEffect : 'none', 

      closeBtn : false, 
      arrows : false, 
      nextClick : true, 

      helpers : { 
       thumbs : { 
        width : 50, 
        height : 50 
       } 
      } 
     }); 

     /* 
     * Media helper. Group items, disable animations, hide arrows, enable media and button helpers. 
     */ 
     $('.fancybox-media') 
      .attr('rel', 'media-gallery') 
      .fancybox({ 
       openEffect : 'none', 
       closeEffect : 'none', 
       prevEffect : 'none', 
       nextEffect : 'none', 

       arrows : false, 
       helpers : { 
        media : {}, 
        buttons : {} 
       } 
      }); 

     /* 
     * Open manually 
     */ 

     $("#fancybox-manual-a").click(function() { 
      $.fancybox.open('1_b.jpg'); 
     }); 

     $("#fancybox-manual-b").click(function() { 
      $.fancybox.open({ 
       href : 'conscious-video.html', 
       type : 'iframe', 
       padding : 5 
      }); 
     }); 

     $("#fancybox-manual-c").click(function() { 
      $.fancybox.open([ 
       { 
        href : '1_b.jpg', 
        title : 'My title' 
       }, { 
        href : '2_b.jpg', 
        title : '2nd title' 
       }, { 
        href : '3_b.jpg' 
       } 
      ], { 
       helpers : { 
        thumbs : { 
         width: 75, 
         height: 50 
        } 
       } 
      }); 
     }); 


    }); 
</script> 

<!------Autoresponder----> 
<script type="text/javascript"> 
    /* <![CDATA[ */  
    $(document).ready(function() { 
     var close_note = $("#note"); 
     close_note.click(function() { 
      j("#note").slideUp(1000, function() { 
       j(this).hide(); 
      }); 
     }); 

     $("#ajax-contact-form").submit(function() { 
      $('#load').append('<center><img src="images/ajax-loader.gif" alt="Currently Loading" id="loading" /></center>'); 

      var fem = $(this).serialize(), 
       note = $('#note'); 

      $.ajax({ 
       type: "POST", 
       url: "contact.php", 
       data: fem, 
       success: function(msg) { 
        if (note.height()) {   
         note.slideUp(1000, function() { 
          $(this).hide(); 
         }); 
        } 
        else note.hide(); 

        $('#loading').fadeOut(300, function() { 
         $(this).remove(); 
         if(msg === 'OK') { 
          $('input').val(""); 
          $('textarea').val(""); 
         } 
         // Message Sent? Show the 'Thank You' message and hide the form 
         result = (msg === 'OK') ? '<div class="success">Your message has been sent. Thank you!</div>' : msg; 

         var i = setInterval(function() { 
          if (!note.is(':visible')) { 
           note.html(result).slideDown(1000); 
           clearInterval(i); 
          } 
         }, 40);  
        }); // end loading image fadeOut 
       } 
      }); 

      return false; 
     }); 
    }); 
    /* ]]> */ 
</script> 
+1

在jQuery中包含兩個不同的(在這種情況下非常不同)版本的jQuery永遠是災難的祕訣。如果聯繫表單代碼真的依賴於這種古老版本的庫,那麼它可能不應該被使用。 – Pointy 2014-08-27 13:58:41

+0

爲什麼包含jQuery的兩個版本?使用一個或另一個。 – sbeliv01 2014-08-27 13:58:58

+0

我剛剛回答了一個類似的問題:http://stackoverflow.com/questions/25522507/jquery-not-loading-properly-in-ie/ – melancia 2014-08-27 14:13:00

回答

1

不要在同一頁面內使用兩個版本的jQuery(不推薦)。

jQuery.noConflict() 

當你使用兩個不同的庫來爭奪$(這是jQuery的別名)時應該使用它。

許多JavaScript庫使用$作爲函數或變量名稱,只是像jQuery那樣使用 。在jQuery的情況下,$是jQuery的別名,所以 所有功能都可以在不使用$的情況下使用。如果您需要使用 另一個JavaScript庫以及jQuery,請將$ back 的控制權返回給另一個庫,並調用$ .noConflict()。舊的引用 $在jQuery初始化期間被保存; noConflict()只是簡單地將它們恢復爲 。

可是......你的情況...文檔說:

如果由於某些原因的jQuery的兩個版本,加載(這是不 推薦),調用$ .noConflict(真)從第二個版本 將全局範圍的jQuery變量返回到第一個版本的 版本。

更多信息:http://api.jquery.com/jquery.noconflict/

好運。