jQuery Mobile是一個基于HTML5的JavaScript框架,可以快速創建跨平臺的Web應用程序。其中, input 是最基本的表單元素之一,用于用戶輸入數據。但是未必需要在界面上一直顯示,可能需要先隱藏它,等到用戶需要輸入數據的時候再顯示出來。
下面是一段隱藏 input 的jQuery Mobile代碼:
$(document).on('pagebeforeshow', '#myPage', function(){ $('#myInput').textinput('disable'); //禁用輸入框 $('#myInputDiv').css('display', 'none'); //隱藏整個輸入框div }); $(document).on('click', '#myButton', function(){ $('#myInputDiv').css('display', 'block'); //顯示整個輸入框div $('#myInput').textinput('enable'); //啟用輸入框 });
上面的代碼中,首先在頁面加載前使用pagebeforeshow事件將輸入框禁用并隱藏其外層div,這樣用戶就看不到它了。然后在點擊某個按鈕的時候,將輸入框的div顯示出來,同時啟用輸入框,此時用戶就能夠看到它并進行輸入了。
這是一個簡單的jQuery Mobile input 隱藏的實現,可以方便地實現輸入框的動態顯示和隱藏,提高應用程序的交互性和用戶體驗。