這篇“微信小程序中如何實(shí)現(xiàn)事件交互操作”文章的知識(shí)點(diǎn)大部分人都不太理解，所以小編給大家總結(jié)了以下內(nèi)容，內(nèi)容詳細(xì)，步驟清晰，具有一定的借鑒價(jià)值，希望大家閱讀完這篇文章能有所收獲，下面我們一起來(lái)看看這篇“微信小程序中如何實(shí)現(xiàn)事件交互操作”文章吧。

創(chuàng)新互聯(lián)成立十年來(lái)，這條路我們正越走越好，積累了技術(shù)與客戶資源，形成了良好的口碑。為客戶提供做網(wǎng)站、網(wǎng)站建設(shè)、網(wǎng)站策劃、網(wǎng)頁(yè)設(shè)計(jì)、空間域名、網(wǎng)絡(luò)營(yíng)銷、VI設(shè)計(jì)、網(wǎng)站改版、漏洞修補(bǔ)等服務(wù)。網(wǎng)站是否美觀、功能強(qiáng)大、用戶體驗(yàn)好、性價(jià)比高、打開快等等，這些對(duì)于網(wǎng)站建設(shè)都非常重要，創(chuàng)新互聯(lián)通過(guò)對(duì)建站技術(shù)性的掌握、對(duì)創(chuàng)意設(shè)計(jì)的研究為客戶提供一站式互聯(lián)網(wǎng)解決方案，攜手廣大客戶，共同發(fā)展進(jìn)步。

什么是事件？

指點(diǎn)擊，觸摸，按下，滑動(dòng)，松開，等一系列對(duì)手機(jī)屏幕操作。

下面代碼所要呈現(xiàn)的效果就是給兩個(gè)按鈕一人一個(gè)ID然后點(diǎn)擊誰(shuí)，在上面顯示信息那就顯示 點(diǎn)擊了誰(shuí)，點(diǎn)擊了多少次，這多少次沒(méi)有分開啊，次數(shù)是點(diǎn)擊他兩的總和。下面另一代碼是分開的，各計(jì)各的。

1. 在index.wxml 中設(shè)置點(diǎn)擊事件（測(cè)試時(shí)需要?jiǎng)h除注釋部分）

<view class="page">
    //點(diǎn)擊后在這里顯示信息，來(lái)表明是有點(diǎn)擊事件的
   <view>{{clickMsg}}</view>
//設(shè)置點(diǎn)擊事件
<view>
  <view id="1" class="view-item" bindtap="clickMe">按鈕1</view>
  <view id="2" class="view-item" bindtap="clickMe">按鈕2</view>
</view>
</view>

2. 在index.wxss中設(shè)置view的樣式

.page{
text-align: center;
}
.view-item{
background-color:green;
width: 60px;
height: 30px;
margin: 30px auto 0 auto;
color: navajowhite;
border-radius: 10px;
padding: 20px;
}

3. 在index.js中設(shè)置點(diǎn)擊事件的響應(yīng)

//注冊(cè)兩個(gè)變量
var id;
var count = 0;
var param = {
 data: {
  clickMsg: '顯示點(diǎn)擊內(nèi)容'
 },
 //function就是觸發(fā)點(diǎn)擊事件的函數(shù)，以后是點(diǎn)擊事件你就這樣寫就行
 //e就是event事件對(duì)象，包含了很多，比如：誰(shuí)被點(diǎn)擊了，什么時(shí)候被點(diǎn)擊了
 clickMe: function (e) {
  count++;
  console.log(e);//把點(diǎn)擊事件詳細(xì)信息打印到調(diào)試的console中
  id = e.currentTarget.id; //獲取被點(diǎn)擊按鈕的id
  param.data.clickMsg = '顯示點(diǎn)了誰(shuí)：' + id + '點(diǎn)擊次數(shù)' + count;
  //重新刷新clickMsg的顯示內(nèi)容，要想看到message變化必須寫這個(gè)
  this.setData(param.data);
 }
};
Page(param);
//這個(gè)必須寫，它是為了讓param這個(gè)函數(shù)真實(shí)化，要不然你干寫著，在index.wxml中調(diào)用時(shí)沒(méi)反應(yīng)的

怎樣讓點(diǎn)擊控件view0攜帶私有信息呢

為了以后傳值什么的

<view class="view-item" data-siyou="飛了" bindtap="clickMe">點(diǎn)擊我view0</view>

怎樣調(diào)用控件私有信息呢？

var param={
  clickMe:function(e){
     id=e.currentTarget.id;
     console.log(e.currentTarget.id.dataset.siyou);
}
};
Page(param);

二、添加判斷的點(diǎn)擊事件

index.wxml

<view class="page">
   <view>{{Message}}</view>
   <view>{{Message1}}</view>
<view>
  <view id="view1" class="view-item" bindtap="clickMe">按鈕1</view>
  <view id="view2" class="view-item" bindtap="clickMe">按鈕2</view>
</view>
</view>

index.js

var id;
var count1 = 0;
var count2 = 0;
var param = {
 data: {
  Message: '點(diǎn)擊后，在這里顯示信息',
  Message1: '點(diǎn)擊后，在這里顯示信息'
 },
 clickMe: function (e) {
  console.log(e);
  id = e.currentTarget.id;
  if (id == 'view1') {
   count1++;
   param.data.Message = '顯示點(diǎn)擊了' + id + '點(diǎn)擊了' + count1 + '次';
   this.setData(param.data);
  } else if (id == 'view2') {
   count2++;
   param.data.Message1 = '顯示點(diǎn)擊了' + id + '點(diǎn)擊了' + count2 + '次';
   this.setData(param.data);
  }
 }
};
Page(param);

以上就是關(guān)于“微信小程序中如何實(shí)現(xiàn)事件交互操作”這篇文章的內(nèi)容，相信大家都有了一定的了解，希望小編分享的內(nèi)容對(duì)大家有幫助，若想了解更多相關(guān)的知識(shí)內(nèi)容，請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

當(dāng)前名稱：微信小程序中如何實(shí)現(xiàn)事件交互操作-創(chuàng)新互聯(lián)
網(wǎng)站路徑：http://aaarwkj.com/article6/gcoig.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供做網(wǎng)站、Google、外貿(mào)網(wǎng)站建設(shè)、網(wǎng)站改版、品牌網(wǎng)站建設(shè)、靜態(tài)網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)