jquery 和其他js框架同时使用的不兼容问题解决方法

来源：互联网发布：连锁店软件多少钱编辑：程序博客网时间：2024/04/27 20:34

jQuery 名称冲突jQuery 使用 $ 符号作为 jQuery 的简介方式。某些其他 JavaScript 库中的函数（比如 Prototype）同样使用 $ 符号。jQuery 使用名为 noConflict() 的方法来解决该问题。var jq=jQuery.noConflict()，帮助您使用自己的名称（比如 jq）来代替 $ 符号。代码使用如下：

var jq=jQuery.noConflict(); //用jq 代替jquery $ 防止冲突

jq(function() {
      id = getQueryString("id");
      jq.ajax( {
            type : "get",
            async : false, //同步执行
            url : basePath + "website/PCDetail?id="+id,
            success : function(result) {
            var dataHtml = "";
            var imgHtml ="";
                  if (result) {

                        var imgUrlList = result.imgUrl.split(",");
                        var imgNameList = result.imgName.split(",");

                        imgHtml += ''
                           +' <script type="text/javascript">'
                           +'    $$.module.pkgInterface.pkgDetail = {};'
                           +'    $$.module.pkgInterface.pkgDetail.today = "";'
                           +'    $$.module.pkgInterface.pkgDetail.pic = ['

                           for(var i=0;i<imgUrlList.length-1;i++){

                                 if(i==imgUrlList.length-1){
                                       imgHtml +='        {max:"'+imgUrlList[i]+'", min:"'+imgUrlList[i]+'",title:"可输入描述文字"}'
                                 }else{
                                       imgHtml +='        {max:"'+imgUrlList[i]+'", min:"'+imgUrlList[i]+'",title:"可输入描述文字"}'
                                       +','
                                 }

                           }

                        imgHtml +=']; </script>'


                        dataHtml = '    <div class="title"><h4>'+result.title+'</h4></div>   <div id="content" class="rightwords" style="width: 700px; word-wrap:break-word;word-break:break-all;">'+result.content+' </div>'

                        jq('#dataHtml').html(dataHtml);
                        jq('#imgHtml').html(imgHtml);
                        jq('#title_type').html(result.type);
                        jq('#hTitle').html(result.title);
                        jq('#title_type_left').html(result.type);
                  }
            },
            error : function(errorMsg) {
                  alert("获取数据失败!");
            }
                  });

      loadtype();//先加载产品类型

      window.init = new Focus($$.module.pkgInterface.pkgDetail.pic);//加载图片

});

结论由于 jQuery 是为处理 HTML 事件而特别设计的，那么当您遵循以下原则时，您的代码会更恰当且更易维护：把所有 jQuery 代码置于事件处理函数中把所有事件处理函数置于文档就绪事件处理器中把 jQuery 代码置于单独的 .js 文件中如果存在名称冲突，则重命名 jQuery 库

0 0