极客观点
项目管理
HarmonyOS
当我静态数据时效果完全可以，如图：
但是做好动态获取数据时，效果则是不行没有触发到，文件已经加载到了，如图：
我怀疑是代码执行顺序的问题，但是一直改都是不行，代码如下：
<script>
//获取信息
(function(){
$.showLoading();
$.ajax({
url: serverurl,
type: "GET",
data: {
type:'10021',
openid:locaopenid
},
dataType: "JSON",
success: function(ret) {
ret = eval("("+ret+")");
$(".nick_name").html(ret.data.nickname);
$("#img").attr('src',ret.data.headimgurl);
},
error: function(jqXHR, textStatus, errorThrown) {
alert(textStatus);
}
});
}());
//获取发表的学客圈
(function(){
$.ajax({
url: serverurl,
type: "GET",
data: {
type:'10090',
openid:locaopenid
},
dataType: "JSON",
success: function(ret) {
ret = eval("("+ret+")");
var str = '';
if (ret.length != '0') {
for (var i = ret.length - 1; i >= 0; i--) {
$(".release_num em").html(ret[i].count);//发布总数
var thumb = ret[i].thumb.split(",")
str += '<li onclick="go_detail('+ret[i].id+')">'
+ '<div class="weui_cell slidelefts">'
+ '<div class="weui_cell_bd weui_cell_primary">'
+ '<div class="fl_new">'
+ '<p class="time">'+Gtime_ymd(ret[i].last_reply_at)+'</p>'
if (ret[i].content !== "") {
str += '<p class="msg more">'+ret[i].content+'</p>'
}
str += '</div>'
if (ret[i].thumb.length != 0 || ret[i].thumb.length != "") {
str += '<div class="rt_img">'
+ '<img src="'+thumb[0]+'?x-oss-process=image/resize,m_fixed,h_200,w_200" alt="">'
+ '</div>'
}
str += '</div>'
+ '<div class="slideleft">'
+ '<span class="bg-red f-white dels">删除</span>'
+ '</div>'
+ '</div>'
+ '</li>'
}
}else{
$(".release_num em").html('0');//发布总数
str += '<div style="color:#5c5c5c; font-size:14px; margin-top:10px; margin-left:10px;">暂无任何发表</div>'
}
$(".list_ul").html(str);
$.hideLoading();
},
error: function(jqXHR, textStatus, errorThrown) {
alert(textStatus);
}
});
}());
</script>
<script src="./js/slideleft.js"></script>slideleft.js文件：
window.slideleft = (function($) {
console.log("执行了这个文件")
var listItem = $('.weui_cell_bd'),
listOpts = $('.slideleft');
var onthel = false, // 是否处于最左端
isScroll = false, // 列表是否滚动状态
initX = 0, // 初始X坐标
initY = 0, // 初始Y坐标
endX = 0, // 结束时X坐标
endY = 0, // 结束时Y坐标
moveX = 0, // listItem 移动的距离
expandLi = null; // 是否存在展开的list
var slideMaxWid = listOpts.width();
var handleSlide = (function() {
console.log("走到了这里")
console.log(listItem)
listItem.on('touchstart',function(e){
console.log("我已经走进来了")
// 判断有无已经展开的li，如果有，是否是当前的li，如果不是，将展开的li收起
if( expandLi ){
if( expandLi.parent().index()!==$(this).parent().index() ){
// 判断当前list是左滑还是上下滑
if( Math.abs(endY-initY) < Math.abs(endX-initX) ){
e.preventDefault();
}
expandLi.css('-webkit-transform','translateX('+0+'px)');
}
}
initX = e.targetTouches[0].pageX;
initY = e.targetTouches[0].pageY;
moveX = $(this).offset().left;
$(this).on('touchmove',function(e){
var curY = e.targetTouches[0].pageY;
var curX = e.targetTouches[0].pageX;
var X = curX - initX; // 不断获取移动的距离
$(this).removeClass('animated');
if( Math.abs(endY-initY)<Math.abs(endX-initX) ){
e.preventDefault();
if( moveX==0 ){
if( X>0 ) {
$(this).css('-webkit-transform','translateX('+0+'px)');
}else if( X<0 ){
if( X<-slideMaxWid ) X=-slideMaxWid;
$(this).css('-webkit-transform','translateX('+X+'px)');
}
}
// 已经处于最左
else if( moveX < 0 ){
onthel = true;
if( X>0 ) { // 向右滑
if( X-slideMaxWid>0 ){
$(this).css('-webkit-transform','translateX('+0+'px)');
}else{
$(this).css('-webkit-transform','translateX('+(X-slideMaxWid)+'px)');
}
}else { // 左滑
$(this).addClass('animated');
$(this).css('-webkit-transform','translateX('+0+'px)');
}
}
}else{
isScroll = true;
}
})
})
listItem.on('touchend',function(e){
endX = e.changedTouches[0].pageX;
endY = e.changedTouches[0].pageY;
var X = endX - initX;
$(this).addClass('animated');
//Slide to right or the distance of slide to left less than 20;
if( X>-20||onthel||isScroll ){
$(this).css('-webkit-transform','translateX('+0+'px)');
onthel = false;
isScroll = false;
}else{
$(this).css('-webkit-transform','translateX('+(-slideMaxWid)+'px)');
expandLi = $(this);
}
})
})();
})(Zepto);
在此先谢过了哈
html5
因为你的数据是后加载的，然后你的html也是动态添加的，而你的js绑定事件是在最开始执行的，也就是并没有给动态添加的
listItem绑定事件。event.target获取触发元素