小程序for循環中通過index實現單個點擊事件


<!--xml-->
<view class='content3-list' wx:for="{{listItems}}" >
<view class='list-left'>
<image id="{{index}}" bindtap='clickRight' src= '{{item.rightImage}}' />
<text class='list-left-wd'>{{item.word}}</text>
<text class='list-left-exp'>{{item.explain}}</text>
</view>
<view class='list-right'>
<image src="../../images/del.png" />
</view>
</view>
 
<!--js-->
Page({
// 頁面的初始數據
data: {
listItems: [
{
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}, {
"rightImage": "/images/right.png",
"word": "book",
"explain": "書;卷;課本;賬簿"
}
]
},
clickRight: function (e) {
var idx = parseInt(e.currentTarget.id);
var img = this.data.listItems;
if ("/images/right.png" == img[idx].rightImage) {
img[idx].rightImage = "/images/right1.png";
} else {
img[idx].rightImage = "/images/right.png";
}
}
})



免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM