3.8.3 开放域按钮偏移

  • Creator 版本:3.8.3

  • 目标平台: 小游戏开发工具&&真机

  • 重现方式:开放域使用getElementsByClassName获取元素,给元素添加点击事件

给获取到的元素添加点击事件之后,点击事件不再元素位置,image

  <view class="container" id="main">
    <scrollview class="list" scrollY="true">
      {{~it.data :item:index}}
        <view class="listItem">
          <image class="listItemBg" src="{{= it.res.bg }}">
            <view class="listItemRank">
              {{? index == 0 }}
                <image class="listItemRankView" src="{{= it.res.rank_1}}">
                </image>
              {{?}}
              {{? index == 1 }}
                <image class="listItemRankView" src="{{= it.res.rank_2}}">
                </image>
              {{?}}
              {{? index == 2 }}
                <image class="listItemRankView" src="{{= it.res.rank_3}}">
                </image>
              {{?}}
              {{? index > 2 }}
                <image class="listItemRankBgView" src="{{= it.res.rankbg}}">
                  <text font="Arial" class="listItemNum" value="{{= index + 1}}"></text>
                </image>
              {{?}}
            </view>
            <image class="listHeadBg" src="{{= it.res.headBg}}">
              <image class="listHeadImg" src="{{= item.avatarUrl }}"></image>
            </image>
            <text class="listItemName" value="{{= item.nickname}}"></text>
            <view class="listRankLevelView">
              <view class="listRankLevelBg" >
                <image class="listRankLevelIcon" src="{{= it.res.friendRankLevel}}"></image>
                <text class="listRankLevelTips" value="通关:"></text>
                <text class="listRankLevelNum" value="{{= item.rankScore}}"></text>
              </view>
            </view>
            {{? !item.self}}
            <image class="listShareIcon" id = "{{= item.openid}}" src="{{= it.res.friendRankShare}}"></image>
            {{?}}
          </image>
        </view>
      {{~}}
      <view class="listBottom"></view>
    </scrollview>
  </view>
</script>
  container: {
    width: 701,
    height: 500,
    backgroundColor: '#00000000',
  },
  list: {
    width: 701,
    height: 500,
  },
  listItem: {
    width: 701,
    height: 93,
  },
  listItemBg: {
    width: 701,
    height: 118,
    flexDirection: 'row',
    alignItems: 'center',
    paddingLeft: 38,
  },
  listItemRank: {
    height: 90,
    width: 90,
    alignItems: 'center',
    top: -5,
  },
  listItemRankView: {
    height: 74,
    width: 54,
  },
  listItemRankBgView: {
    height: 68,
    width: 69,
    top:5,
  },
  listItemNum: {
    fontSize: 32,
    fontFamily: 'Arial',
    fontWeight: 'bold',
    lineHeight: 70,
    height: 70,
    textAlign: 'center',
    width: 70,
    verticalAlign: 'middle'
  },
  listHeadBg: {
    width: 77,
    height: 78,
    alignItems: 'center',
    left: 8,
    top:-5,
  },
  listHeadImg: {
    width: 61,
    height: 61,
    marginTop: 6,
  },
  listItemName: {
    fontSize: 21,
    height: 25,
    left: 25,
    top: -10,
    lineHeight: 25,
    width: 120,
    color: '#FFFFFF',
    textStrokeWidth: 3,
    textStrokeColor: '#1A4284'
  },
  listRankLevelView: {
    width: 178,
    height: 37,
    left: 52,
    top: -5,
  },
  listRankLevelBg: {
    width: 178,
    height: 37,
    backgroundColor: '#5E98D7',
    borderRadius: 18.5,
    alignItems: 'center',
    flexDirection: 'row',
  },
  listRankLevelIcon: {
    width: 46,
    height: 51,
    marginTop: 0,
    left: -21,
    top: -5,
  },
  listRankLevelTips: {
    fontFamily: 'Arial',
    fontSize: 22,
    height: 22,
    lineHeight: 22,
    width: 40,
    color: '#FFFFFF',
    textStrokeWidth: 3,
    textStrokeColor: '#1A4284',
    left: -5,
  },
  listRankLevelNum: {
    fontFamily: 'Arial',
    fontSize: 32,
    height: 22,
    lineHeight: 22,
    width: 60,
    color: '#FFFFFF',
    textStrokeWidth: 3,
    textStrokeColor: '#1A4284',
    left: 18,
  },
  listShareIcon: {
    height: 46,
    width: 49,
    left: 95,
    top:-10,
    ':active': {
      transform: 'scale(1.05, 1.05)',
    },
  },
  listBottom: {
    height: 20,
    width: 701
  }
};