1. 程式人生 > >微信小程式wx:for給每一個元素加事件,並獲取元素內容

微信小程式wx:for給每一個元素加事件,並獲取元素內容

首先是wxml

 <view class='js'>
        <view wx:for="{{adressMessages}}">/*這裡是元素的內容*/
            <text class='diming'>{{item.diming}}</text>
            <view class='lines1'></view>
            <view class='lv2'>地址:</view>
            <view style='width:650rpx'>
                <text class='txt' decode="{{true}}">{{item.dz}}</text>
            </view>
            <view class='lv2'>諮詢電話:</view>/*這裡我們需要點選電話號碼撥打電話*/
            <view style='width:650rpx'>
                 /*設定bindtap點選事件函式*/
                /*關鍵一部,設定data-item或者data-id等等,裡面填你要打的電話*/
                <text class='txt colors' decode="{{true}}" bindtap='call1' data-item="{{item.phone1}}">{{item.phone1}}</text>
                <text decode="{{true}}">&nbsp;&nbsp;</text>
                <text class='txt colors' decode="{{true}}" bindtap='call2' data-item="{{item.phone2}}">{{item.phone2}}</text>
                <!-- <text decode="{{true}}"></text> -->
                <text class='txt' decode="{{true}}"> {{item.teacher}}</text>
            </view>
            <view class='lv2'>諮詢QQ:</view>
            <view style='width:650rpx'>
                <text class='txt' decode="{{true}}">{{item.qq}}</text>
            </view>
            <view style='height:50rpx'></view>
        </view>
    </view>

照例無關css不寫

js頁面

data: {
        //相關資訊的填寫
      adressMessages:[
          { 'diming': '杭州總部', 'dz': '杭州市下沙6號大街260號中自科技園3幢2樓(23號大街與6號大街街交界處)\n(地鐵1號至文海南路站                 下車;公交可坐B1區間2、k104至6號大街23號路口下車)', 'phone1': '0571-86926616', 'phone2': '15372045773', 'teacher': '(楊老師)', 'qq':'1040745679、1363776175'},
          { 'diming': '衢州分部', 'dz': '衢州柯城區亭川東路393號', 'phone1': '15372408002', 'phone2': '', 'teacher': '(微信同步)馮老師', 'qq': '3558529686' },
          { 'diming': '寧波分部', 'dz': '寧波市海曙區新典路46號寧波職業技術學院', 'phone1': '15306717201', 'phone2': '', 'teacher': '(微信同步)李老師', 'qq': '2211974900' },
          { 'diming': '金華分部', 'dz': '金華義烏市稠城江東中路346號 百瑞酒店7樓', 'phone1': '13750925779', 'phone2': '', 'teacher': '(微信同步)黃老師', 'qq': '2965708836' },
          { 'diming': '溫州分部', 'dz': '溫州市茶山鎮鞋城路10號', 'phone1': '15306718513', 'phone2': '', 'teacher': '(微信同步)沈老師', 'qq': '2240288265' },
          { 'diming': '紹興分部', 'dz': '浙江越秀外國語學院:紹興越城區會稽路428號', 'phone1': '15306717201', 'phone2': '', 'teacher': '(微信同步)李老師', 'qq': '2211974900' },
          { 'diming': '麗水分部', 'dz': '麗水市蓮都區學院路1號麗水學院民族學院', 'phone1': '15372413313', 'phone2': '', 'teacher': '(微信同步)陳老師', 'qq': '1784518088' },
          { 'diming': '台州分部', 'dz': '臨海市東方大道605號台州學院', 'phone1': '15306718513', 'phone2': '', 'teacher': '(微信同步)沈老師', 'qq': '2240288265' },
      ]
  
  },
  //彈框電話
  call1:function(e){
       //重要的一步,獲取你的元素 我寫的是data-item,這裡就是e.currentTarget.dataset.item
        //如果是id或者其他的只要改下就好了
      var phonenum = e.currentTarget.dataset.item
      wx:wx.makePhoneCall({
          phoneNumber: phonenum,
          success: function(res) {},
          fail: function(res) {},
          complete: function(res) {},
      })
  },
  call2: function (e) {
      var phonenum = e.currentTarget.dataset.item
      wx: wx.makePhoneCall({
          phoneNumber: phonenum,
          success: function (res) { },
          fail: function (res) { },
          complete: function (res) { },
      })
  },

//加幾張效果圖片吧