<!--index.wxml--><block wx:for="{{stars}}"> <image class="star-image" style="left: {{item*150}}rpx" src="{{key > item ?(key-item == 0.5?halfSrc:selectedSrc) : normalSrc}}">  <view class="item" style="left:0rpx" data-key="{{item+0.5}}" bindtap="selectLeft"></view>  <view class="item" style="left:75rpx" data-key="{{item+1}}" bindtap="selectRight"></view> </image></block>

.star-image { position: absolute; top: 50rpx; width: 150rpx; height: 150rpx; src: "../../images/normal.png";}.item { position: absolute; top: 50rpx; width: 75rpx; height: 150rpx;}

//index.js//CSDN微信小程序開發(fā)專欄:http://blog.csdn.net/column/details/13721.html//獲取應(yīng)用實(shí)例var app = getApp()Page({ data: {  stars: [0, 1, 2, 3, 4],  normalSrc: '../../images/normal.png',  selectedSrc: '../../images/selected.png',  halfSrc: '../../images/half.png',  key: 0,//評(píng)分 }, onLoad: function () { }, //點(diǎn)擊右邊,半顆星 selectLeft: function (e) {  var key = e.currentTarget.dataset.key  if (this.data.key == 0.5 && e.currentTarget.dataset.key == 0.5) {   //只有一顆星的時(shí)候,再次點(diǎn)擊,變?yōu)?顆   key = 0;  }  console.log("得" + key + "分")  this.setData({   key: key  }) }, //點(diǎn)擊左邊,整顆星 selectRight: function (e) {  var key = e.currentTarget.dataset.key  console.log("得" + key + "分")  this.setData({   key: key  }) }})