0

我有一个网站，其中包含大部分 js 功能，我想从 mootools 添加登录表单。我添加了表单和它工作所需的文件，但另一个站点已停止我知道这是 javascript 冲突这是我的头文件：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="tr" >
<head>
    <meta http-equiv="content-type" content="text/xml; charset=utf-8" /> 
    <!--Site CSS-->
    <link href="include-css/SCOREMIX.css" rel="stylesheet" type="text/css" />
    <!-- Latest Jquery Lib-->
    <script type="text/javascript" src="include-js/jquery-1.8.3.js"></script>
    <!-- Mootools - the core -->
    <script type="text/javascript" src="include-js/mootools12.js"></script>
    <!-- MooSlide (show/hide login form) -->
    <script type="text/javascript" src="include-js/mooSlide2-moo12.js"></script>
    <!--News scroller-->
    <script type="text/javascript" src="include-js/jscroller-0.4.js"></script>

    <!--timer for ticking at live games and to update information each minute-->
    <script type="text/javascript" src="include-js/jquery_timer.js" ></script>
    <!-- MY JS FILES-->
    <script type="text/javascript" src="include-js/functions.js"></script>
    <script type="text/javascript" src="include-js/script.js" ></script>


    <script language="javascript" type="text/ecmascript">
    window.addEvent('domready',function(){
        var myLogin = new mooSlide2({ slideSpeed: 1500, fadeSpeed: 500,  toggler:'login', content:'loginPanel', close: false, effects:Fx.Transitions.Bounce.easeOut , from:'top'});
        //optional: AutoStart the slider on page load:
        //MyLogin.run();
        $('close').addEvent('click', function(e){
            e = new Event(e);
            myLogin.clearit();
            e.stop();
        });
    });
    </script>

</head>

该脚本适用于 mootools，并且对所需文件进行了注释。运行网站时出现此错误：

Uncaught TypeError: Object #<HTMLDocument> has no method 'ready'

和：

Uncaught TypeError: Object function (B,C){if(B&&B.$family&&B.uid){return B;}var A=$type(B);return($[A])?$[A](B,C,this.document):null;} has no method 'ajax'

有没有人可以帮助我知道我是否应该更改 JS 文件的顺序，或者我可以做些什么来阻止冲突？

PS：当我更改标头中 mootools 文件的位置时，我会收到不同的消息。

4

2 回答 2

1

替换$为jQuery 例如，而不是使用

$("div p").hide()jQuery("div p").hide();改为使用

http://api.jquery.com/jQuery.noConflict/

也试试这个

   var j = jQuery.noConflict();
   // Do something with jQuery
   j("div p").hide();
   // Do something with another library's $()  
  $("content").style.display = 'none';
于 2013-06-29T06:49:04.223 回答
0

尝试替换您的 mootool js 和 jquery 脚本并再次检查？

例子

    <script type="text/javascript" src="jquery-1.3.js"></script>
    <script type="text/javascript">
        //no conflict jquery
        jQuery.noConflict();
        //jquery stuff
        (function($) {
            $('p').css('color','#ff0000');
        })(jQuery);
    </script>
    <script type="text/javascript" src="moo1.2.js"></script>
    <script type="text/javascript">
        //moo stuff
        window.addEvent('domready',function() {
            $$('p').setStyle('border','1px solid #fc0');
        });
    </script>

尝试使用这个，你的代码

    <!--Site CSS-->
    <link href="include-css/SCOREMIX.css" rel="stylesheet" type="text/css" />

    <!--///// MOOTOOLS /////-->
    <!-- Mootools - the core -->
    <script type="text/javascript" src="include-js/mootools12.js"></script>
    <!-- MooSlide (show/hide login form) -->
    <script type="text/javascript" src="include-js/mooSlide2-moo12.js"></script>    
    <script type="text/javascript">
        window.addEvent('domready',function(){
            var myLogin = new mooSlide2({ slideSpeed: 1500, fadeSpeed: 500,  toggler:'login', content:'loginPanel', close: false, effects:Fx.Transitions.Bounce.easeOut , from:'top'});
            //optional: AutoStart the slider on page load:
            //MyLogin.run();
            $('close').addEvent('click', function(e){
                e = new Event(e);
                myLogin.clearit();
                e.stop();
            });
        });
    </script>

    <!--///// JQUERY /////--> 
    <!-- Latest Jquery Lib-->
    <script type="text/javascript" src="include-js/jquery-1.8.3.js"></script>   
    <!--News scroller-->
    <script type="text/javascript" src="include-js/jscroller-0.4.js"></script>
    <!--timer for ticking at live games and to update information each minute-->
    <script type="text/javascript" src="include-js/jquery_timer.js" ></script>
    <!-- MY JS FILES-->
    <script type="text/javascript" src="include-js/functions.js"></script>
    <script type="text/javascript" src="include-js/script.js" ></script>
    <script type="text/javascript">
        $(document).ready(function(){
            // jquery scripts                              
        });
    </script>
于 2013-06-29T08:59:09.433 回答