功能需求

設(shè)備號和攝像頭都可以下拉選擇，但是具體的攝像頭下拉選項(xiàng)是根據(jù)設(shè)備號而定的。如下圖，尾號為352的設(shè)備號只有前置攝像頭，尾號為657的設(shè)備號前置和后置攝像頭都有。

問題說明

一般情況下，這個(gè)需求很簡單，當(dāng)選擇設(shè)備號的時(shí)候js動態(tài)改變攝像頭選項(xiàng)里面的值就可以了，但是WEUI picker和Select組件都不支持動態(tài)改變選項(xiàng)，只支持初始賦值。

解決方案

因?yàn)閜icker和Select組件是通過input標(biāo)簽綁定，可以先通過input的父級元素移除input標(biāo)簽，重新插入input標(biāo)簽，最后重新初始化picker或Select組件。

核心代碼

<!--頁面部分--> <div id="box"><input type="text" id='camera' value="前置攝像頭"/> </div> /*js部分，myPicker是設(shè)備號input的ID*/ $('#myPicker').change(function () {/*選擇設(shè)備號后,根據(jù)當(dāng)前設(shè)備號設(shè)置不同的攝像頭選項(xiàng),具體判斷邏輯根據(jù)具體的項(xiàng)目而定*/var val = $("#myPicker").val();if (val === "*******352") {$("#box").empty();$("#box").html("<input type='text' id='camera' value='前置攝像頭'/>");$("#camera").picker({title: "請選擇攝像頭",cols: [{textAlign: 'center',values: ['前置攝像頭']}]});} else {$("#box").empty();$("#box").html("<input type='text' id='camera' value='前置攝像頭'/>");$("#camera").picker({title: "請選擇攝像頭",cols: [{textAlign: 'center',values: ['前置攝像頭', '后置攝像頭', '前+后攝像頭']}]});} });

今天就分享到這里，文中表述僅代表個(gè)人觀點(diǎn)，有問題歡迎留言交流，或關(guān)注樓主微信公眾號：上班熊的環(huán)球夢。

?

總結(jié)

以上是生活随笔為你收集整理的WEUI picker组件无法js动态改变选项的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。