解决velocity与jquery的冲突

2024-05-07 19:48

本文主要是介绍解决velocity与jquery的冲突,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1、使用jQuery代替$. 如:jQuery.ajax();

缺点:不适合扩展,一旦替换成第三方库时,那就麻烦大发

2、使用jQuery.noConflict。 如:var j = jQuery.noConflict(); j.ajax();

缺点:当使用jQuery的相关插件时,会使得插件失效哦!

3、wrap jQuery中的冲突方法。

如$.ajax()在Velocity中会冲突,则重新定义如下:

function dw(){}

dw.ajax=function(s){ jQuery.ajax(s); } dw.ajax();

方案3基本上解决了1、2中的缺点~~~故推荐使用第三种方法!

4、

定义一个 $JQ="$."

以后可以用 ${JQ}ajax().......

<script type="text/javascript">
  var PRICE_FORMAT = '&yen;%s';
  $(function(){//首页左侧分类菜单
    $(".category ul.menu").find("li").each(function() {$(this).hover(function() {var cat_id = $(this).attr("cat_id");
                        var menu = $(this).find("div[cat_menu_id='"+cat_id+"']");
                        menu.show();
                        $(this).addClass("hover");
                        var menu_height = menu.height();
                        if (menu_height < 60) menu.height(80);
                        menu_height = menu.height();
                        var li_top = $(this).position().top;
                        $(menu).css("top",-li_top + 38);
                      },
                      function() {$(this).removeClass("hover");
                        var cat_id = $(this).attr("cat_id");
                        $(this).find("div[cat_menu_id='"+cat_id+"']").hide();
                      });
            });
    $(".head-user-menu dl").hover(function() {$(this).addClass("hover");
            },
            function() {$(this).removeClass("hover");
            });
    $('.head-user-menu .my-mall').mouseover(function(){// 最近浏览的商品
      load_history_information();
      $(this).unbind('mouseover');
    });
    $('.head-user-menu .my-cart').mouseover(function(){// 运行加载购物车
      load_cart_information();
      $(this).unbind('mouseover');
    });
    $('#button').click(function(){if ($('#keyword').val() == '') {if ($('#keyword').attr('data-value') == '') {return false
        } else {window.location.href="http://b2b2c.shopnctest.com/test/shop/index.php?act=search&op=index&keyword="+$('#keyword').attr('data-value');
          return false;
        }}});
    $(".head-search-bar").hover(null,
            function() {$('#search-tip').hide();
            });
    // input ajax tips
    $('#keyword').focus(function(){$('#search-tip').show()}).autocomplete({//minLength:0,
      source: function (request, response) {$.getJSON('http://b2b2c.shopnctest.com/test/shop/index.php?act=search&op=auto_complete', request, function (data, status, xhr) {$('#top_search_box > ul').unwrap();
          response(data);
          if (status == 'success') {$('#search-tip').hide();
            $(".head-search-bar").unbind('mouseover');
            $('body > ul:last').wrap("<div id='top_search_box'></div>").css({'zIndex':'1000','width':'362px'});
          }});
      },
      select: function(ev,ui) {$('#keyword').val(ui.item.label);
        $('#top_search_form').submit();
      }});
    $('#search-his-del').on('click',function(){$.cookie('9204_his_sh',null,{path:'/'});$('#search-his-list').empty();});
  });
</script>
将$.改为jQuery就不会报错

  source: function (request, response) {jQuery.getJSON('http://b2b2c.shopnctest.com/test/shop/index.php?act=search&op=auto_complete', request, function (data, status, xhr) {$('#top_search_box > ul').unwrap();
      response(data);
      if (status == 'success') {$('#search-tip').hide();
        $(".head-search-bar").unbind('mouseover');
        $('body > ul:last').wrap("<div id='top_search_box'></div>").css({'zIndex':'1000','width':'362px'});
      }});
  },
  select: function(ev,ui) {$('#keyword').val(ui.item.label);
    $('#top_search_form').submit();
  }
});
$('#search-his-del').on('click',function(){jQuery.cookie('9204_his_sh',null,{path:'/'});$('#search-his-list').empty();});

这篇关于解决velocity与jquery的冲突的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/968224

相关文章

C++右移运算符的一个小坑及解决

《C++右移运算符的一个小坑及解决》文章指出右移运算符处理负数时左侧补1导致死循环,与除法行为不同,强调需注意补码机制以正确统计二进制1的个数... 目录我遇到了这么一个www.chinasem.cn函数由此可以看到也很好理解总结我遇到了这么一个函数template<typename T>unsigned

Vue和React受控组件的区别小结

《Vue和React受控组件的区别小结》本文主要介绍了Vue和React受控组件的区别小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录背景React 的实现vue3 的实现写法一:直接修改事件参数写法二:通过ref引用 DOMVu

Java实现将HTML文件与字符串转换为图片

《Java实现将HTML文件与字符串转换为图片》在Java开发中,我们经常会遇到将HTML内容转换为图片的需求,本文小编就来和大家详细讲讲如何使用FreeSpire.DocforJava库来实现这一功... 目录前言核心实现:html 转图片完整代码场景 1:转换本地 HTML 文件为图片场景 2:转换 H

C#使用Spire.Doc for .NET实现HTML转Word的高效方案

《C#使用Spire.Docfor.NET实现HTML转Word的高效方案》在Web开发中,HTML内容的生成与处理是高频需求,然而,当用户需要将HTML页面或动态生成的HTML字符串转换为Wor... 目录引言一、html转Word的典型场景与挑战二、用 Spire.Doc 实现 HTML 转 Word1

Vue3绑定props默认值问题

《Vue3绑定props默认值问题》使用Vue3的defineProps配合TypeScript的interface定义props类型,并通过withDefaults设置默认值,使组件能安全访问传入的... 目录前言步骤步骤1:使用 defineProps 定义 Props步骤2:设置默认值总结前言使用T

504 Gateway Timeout网关超时的根源及完美解决方法

《504GatewayTimeout网关超时的根源及完美解决方法》在日常开发和运维过程中,504GatewayTimeout错误是常见的网络问题之一,尤其是在使用反向代理(如Nginx)或... 目录引言为什么会出现 504 错误?1. 探索 504 Gateway Timeout 错误的根源 1.1 后端

解决升级JDK报错:module java.base does not“opens java.lang.reflect“to unnamed module问题

《解决升级JDK报错:modulejava.basedoesnot“opensjava.lang.reflect“tounnamedmodule问题》SpringBoot启动错误源于Jav... 目录问题描述原因分析解决方案总结问题描述启动sprintboot时报以下错误原因分析编程异js常是由Ja

深度剖析SpringBoot日志性能提升的原因与解决

《深度剖析SpringBoot日志性能提升的原因与解决》日志记录本该是辅助工具,却为何成了性能瓶颈,SpringBoot如何用代码彻底破解日志导致的高延迟问题,感兴趣的小伙伴可以跟随小编一起学习一下... 目录前言第一章:日志性能陷阱的底层原理1.1 日志级别的“双刃剑”效应1.2 同步日志的“吞吐量杀手”

MySQL 表空却 ibd 文件过大的问题及解决方法

《MySQL表空却ibd文件过大的问题及解决方法》本文给大家介绍MySQL表空却ibd文件过大的问题及解决方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考... 目录一、问题背景:表空却 “吃满” 磁盘的怪事二、问题复现:一步步编程还原异常场景1. 准备测试源表与数据

解决Nginx启动报错Job for nginx.service failed because the control process exited with error code问题

《解决Nginx启动报错Jobfornginx.servicefailedbecausethecontrolprocessexitedwitherrorcode问题》Nginx启... 目录一、报错如下二、解决原因三、解决方式总结一、报错如下Job for nginx.service failed bec