微信小程序單選radio及多選checkbox按鈕用法示例
更新時間：2019年04月30日 10:27:34 作者：weixin_41991473
這篇文章主要介紹了微信小程序單選radio及多選checkbox按鈕用法,結合實例形式分析了微信小程序中單選radio及多選checkbox按鈕的選項設置、讀取、選中等相關操作技巧,需要的朋友可以參考下
本文實例講述了微信小程序單選radio及多選checkbox按鈕用法。分享給大家供大家參考，具體如下：
1.單選：radio
實例：
js:
Page({
data : {
radioId:"",
loves:[
{id:1, name:"跑步" ,checked : 'true'},
{id:2, name:"籃球" },
{id:3, name:"足球" },
]
},
updataRadio:function(e){
var Id=e.value.id
this.setData({
radioId:Id
})
},
})
wxml:
<radio-group class="radio" bindChange="updataRadio">
<view wx:for="{{loves}}">
<radio value="{{item.id}}" checked="{{item.checked}}">{{item.name}}</radio>
</view>
</radio-group>
2.多選：CheckBox
實例：
js:
Page({
data : {
radioId:[],
loves:[
{id:1, name:"跑步" ,checked : 'true'},
{id:2, name:"籃球" },
{id:3, name:"足球" },
]
},
updataRadio:function(e){
var Id=e.value.id
this.setData({
radioId:Id
})
},
})
wxml:
<checkbox-group class="checkbox" bindChange="updataRadio">
<view wx:for="{{loves}}">
<chechbox value="{{item.id}}" checked="{{item.checked}}">{{item.name}}</chechbox>
</view>
</checkbox-group>
附：多選獲得的值是一個數(shù)組，單選獲得的值是一個單值
希望本文所述對大家微信小程序開發(fā)有所幫助。
相關文章
在web端，輸入的時候，很容易在文本框消失焦點的時候，點擊退格鍵，頁面就回退了，下面是一種屏蔽頁面回退鍵的方法,一起看看吧2016-12-12
本文主要介紹了js前端URL含有特殊字符的轉碼的實現(xiàn)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2023-06-06
微信小程序BindTap快速連續(xù)點擊目標頁面跳轉多次問題處理
這篇文章主要介紹了微信小程序BindTap快速連續(xù)點擊目標頁面跳轉多次問題處理，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-04-04
這篇文章主要為大家詳細介紹了原生js實現(xiàn)下拉框選擇組件的開發(fā)，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-01-01
這篇文章主要為大家介紹了JavaScript設計模式中的觀察者模式，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-01-01
本系列博文主要談一些在 javascript 使用中經(jīng)常會混淆的高級應用,包括: prototype, closure, scope, this關鍵字. 對于一個需要提高自己javascript水平的程序員,這些都是必須要掌握的.2009-09-09
這篇文章主要給大家介紹了關于echarts餅圖各個板塊之間的空隙如何實現(xiàn)的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-12-12
這篇文章主要介紹了uni-app 滾動到指定位置的操作方法,其中方法一是使用標簽,可以將頁面橫向（或縱向）滾動到指定位置還有其他多種方法,需要的朋友可以參考下2024-05-05
當你進行函數(shù)的嵌套時，要注意實際上作用域鏈是發(fā)生變化的，這點可能看起來不太直觀。你可把下面的代碼置入firebug監(jiān)視值的變化。2010-03-03
showModalDialog模態(tài)對話框的使用詳解以及瀏覽器兼容
showModalDialog是jswindow對象的一個方法，和window.open一樣都是打開一個新的頁面。區(qū)別是：showModalDialog打開子窗口后，父窗口就不能獲取焦點了（也就是無法操作了）2014-01-01