解决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

相关文章

关于HTML的多媒体标签

代码示例如下: <!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content="EditPlus?"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Descriptio

关于HTML的框架标签及内嵌框架

框架标签的代码示例如下: <!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content="EditPlus?"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Desc

关于HTML的表格标签

代码示例如下: <!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content="EditPlus?"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Descriptio

关于HTML的清单标签

代码示例如下: <!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content="EditPlus?"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Descriptio

关于HTML的图片标签

代码示例如下: <!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content="EditPlus?"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Descriptio

关于HTML的字体标签

代码示例如下: <!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content="EditPlus?"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Descripti

关于HTML的排版标签

代码示例如下: <!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content="EditPlus?"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Descriptio

Jquery 实现表单提交按钮变灰,防止多次点击提交重复数据

表单提交时候我们应该控制提交按钮,不能点击多次进行数据的重复提交。要不然就会有冗余的重复的数据在系统中,造成系统出现数据垃圾。jQuery很简单的就可以实现对表单提交按钮控制,下面就是相关的例子和代码。 <form action="${pageContext.servletContext.contextPath}/XXX/###" method="post" id="messag

2019年长沙前端技术分享大会圆满成功

做一个积极的人 编码、改bug、提升自己 我有一个乐园,面向编程,春暖花开! 本文首发: 唐胡子俱乐部,授权发布! 摘要 长沙百名互联网前端程序员齐聚长沙互联网活动基地(唐胡子俱乐部)。 主办单位:唐胡子俱乐部 支持单位:芒果TV,拓维,湘邮,58到家,御泥坊,兴盛优选,中软国际,长海科技,长沙联通 时 间:2019年5月19日 ----------------------