自定義 radio 樣式（微信小程序）

 

在通常 web 開發中，經常使用的思路有兩種（純CSS）：

1. 隱藏原生 radio，使用 :checked 選擇器和 + 兄弟選擇器，給兄弟元素 label 添加僞元素樣式（::before / ::after）

2. 仍是隱藏原生 radio，使用 :checked 選擇器和 + 兄弟選擇器，不過是給 label 加一個背景圖片（雪碧圖），控制 background-position 來實現

傳送門：http://ife.baidu.com/note/detail/id/28

 

可是，微信小程序並不支持 + 兄弟選擇器，CSS 道路不通。

加上不能操做 DOM 元素，也不能經過 JavaScript 在 change 的回調函數中更改對應 label 的樣式。

因此只好經過小程序的框架實現 事件響應--> 數據修改--> 動態渲染 來模擬一個 radio-group。

傳送門： http://www.wxapp-union.com/forum.php?mod=viewthread&tid=3720