1. 程式人生 > >zepto與jquery還有vue的衝突解決

zepto與jquery還有vue的衝突解決

在引用上需要按這個順序引用

<script src="/beiqi/js/jquery-3.1.1.min.js"></script>
<script>jQuery.noConflict()</script>
<script type="text/javascript" src="/beiqi/js/zepto.min.js"></script>
如果遇到vue有衝突,需要拋棄vue.js了,哎 也是比較無奈,頁面程式碼這是用ajax硬拼接的頁面,如圖
jQuery.ajax({
url: juli.URL.deleteclocksql
, type: "get", cache: false , data: { "ids":ids, "openid":localStorage.getItem(juli.openIdkey), "deviceId":localStorage.getItem(juli.snkey), "cls":"rm", } }) .done(function (data) { if(data.statue=="SUCCESS"){ el = document.getElementById('htmls'); $(el).html(""); var clocklist
=data.list; if(typeof(clocklist)!="undefined"){ for(var i=0;i<clocklist.length;i++){ var htmls=""; htmls+='<section class="list">'+ '<ul class="list-ul">'+ '<li class="list-li">'+ '<div class="con">'+ '<div class="left">'+ '<p>'+clocklist[i].clocktime
+'</p>'+ '<p>'+clocklist[i].clocktext+'</p>'+ '</div>'+ '<section class="model-2">'; if(clocklist[i].stat==1){ htmls+='<div class="checkbox">'+ '<input type="checkbox" checked="checked" name="openclock" value="'+clocklist[i].ids+'" onclick="setclock(this)"/>'+ '<label></label>'+ '</div>'; }else{ htmls+='<div class="checkbox">'+ '<input type="checkbox" name="openclock" value="'+clocklist[i].ids+'" onclick="setclock(this)"/>'+ '<label></label>'+ '</div>'; } htmls+='</section>'+ '</div>'+ '<div class="btn">'+ '<input type="button" onclick="deleteclock(this)" ss="'+clocklist[i].ids+'"/>'+ '<input type="button" onclick="bianjiclock(this)" ss="'+clocklist[i].ids+'"/>'+ '</div>'+ '</li>'+ '</ul>'+ '</section>' $(el).append(htmls); } }
而且在引用zepto.js是需要初始化的,如圖
jQuery(document).ready(function(){
$('.list-li').touchWipe({itemDelete: '.btn'});
});
在這個頁面中 所有的$需要換成jQuery!!!包括引用的js中的$也需要變成jQuery。