mui日期選擇器彈出兩次的解決方法
今天在用mui做日期選擇的時候,發現日期彈出視窗彈出兩次,程式碼並無問題,後來測試發現js被呼叫了兩次,DtPicker程式碼如下:
/*日期選擇*/
(function($) {
$.init();
var result = $('#result')[0];
var btns = $('.btn');
btns.each(function(i, btn) {
btn.addEventListener('tap', function() {
var optionsJson = this.getAttribute('data-options') || '{}';
var options = JSON.parse(optionsJson);
var id = this.getAttribute('id');
/*
* 首次顯示時例項化元件
* 示例為了簡潔,將 options 放在了按鈕的 dom 上
* 也可以直接通過程式碼宣告 optinos 用於例項化 DtPicker
*/
var picker = new $.DtPicker(options);
picker.show(function(rs) {
/*
* rs.value 拼合後的 value
* rs.text 拼合後的 text
* rs.y 年,可以通過 rs.y.vaue 和 rs.y.text 獲取值和文字
* rs.m 月,用法同年
* rs.d 日,用法同年
* rs.h 時,用法同年
* rs.i 分(minutes 的第二個字母),用法同年
*/
result.innerText = ' ' + rs.text;
/*
* 返回 false 可以阻止選擇框的關閉
* return false;
*/
/*
* 釋放元件資源,釋放後將將不能再操作元件
* 通常情況下,不需要示放元件,new DtPicker(options) 後,可以一直使用。
* 當前示例,因為內容較多,如不進行資原釋放,在某些裝置上會較慢。
* 所以每次用完便立即呼叫 dispose 進行釋放,下次用時再建立新例項。
*/
picker.dispose();
});
}, false);
});
})(mui);
發現上述程式碼中new語句執行了兩次,因為看到是為btn加了tap事件,所以想到是不是因為mui監聽的tap和自己新增的tap衝突,於是禁用了mui的tap監聽
mui.init({
//禁用mui tap監聽 否則點選生日選擇會彈出兩次
gestureConfig:{
tap:false
}
});
問題解決!(開心)
相關文章
- mui退出軟體點選兩次提示UI
- jQuery選擇器——層次選擇器jQuery
- jQuery選擇器之層次選擇器jQuery
- OC:自定義日期選擇器
- jQuery選擇器介紹:基本選擇器、層次選擇器、過濾選擇器、表單選擇器jQuery
- MFC彈出選單隱藏解決
- MUI-城市聯動,日期聯動-picker(選擇器)學習筆記(附最詳註釋)UI筆記
- 【Swift】彈出日曆選擇框Swift
- 解決element-plus el-select在IOS下可清除狀態時有值時要點兩次才彈出選擇框問題iOS
- Jquery 日期選擇jQuery
- 自動彈出網頁或不定時彈出網頁的解決方法網頁
- 安卓製作日期選擇器Datepicker安卓
- UpdatePanel下解決提示框不彈出的方法
- 微信小程式自定義tabbar圖示切換點選兩次才選中解決方法微信小程式tabBar
- 短視訊系統原始碼,點選選擇框,底部彈出可以選擇的選項原始碼
- 直播帶貨原始碼,日期時間選擇器 選擇範圍限制原始碼
- 基於Vue元件化的日期聯動選擇器Vue元件化
- Android開發之GridView實現彈出式選擇器AndroidView
- 將input file的選擇的檔案清空的兩種解決方案
- 成功解決PyCharm 彈出 Server‘s certificate is not trusted 的簡單解決方法PyCharmServerRust
- 一次地址選擇器的實踐
- 穩定簽名怎麼選擇?-蘋果將要每年兩次釋出iPhone蘋果iPhone
- element ui 自定義的快捷選項的日期選擇器並格式化UI
- web技術分享| 日期選擇限制元件二次封裝Web元件封裝
- window10系統u盤不能彈出的解決方法
- win10 360經常彈出廣告提示的解決方法Win10
- Excel檔案彈出隱私問題警告的解決方法Excel
- CSS 選擇器詳解CSS
- jQuery - 選擇器詳解jQuery
- 002---選擇器(標籤選擇器、類選擇器、id選擇器、偽類選擇器、萬用字元選擇器)字元
- php讀取mssql日期出現中文字元的解決方法PHPSQL字元
- antd日期選擇框,前後日期增加限制
- 直播系統程式碼,點選選擇欄,彈出各個選項
- axios傳送兩次請求原因及解決方法iOS
- 一個開源、美觀的日期選擇器(bootstrap datepicker)boot
- 使用element ui 日期選擇器獲取值後的格式問題UI
- 2 Elment Ui 日期選擇器 格式化問題UI
- MUI DtPicker 顯示自定義日期UI