JQueryMobile：在運行時將html-input-type更改為“ number”嗎？

Question

我正在嘗試使用WebView制作JQuery-mobil應用程序+ Android。

該應用程序的html-input默認情況下設置為type="text"如果最終用戶按輸入，則彈出標准Android鍵盤彈出窗口。

像這樣：

還行吧

但是我需要一個按鈕，將type更改為type="number"這樣在按下鍵盤時僅顯示數字。

像這樣：

這是我用於此的HTML：

/*html-input*/
<input type="text" name="regnr" value=""/>

/*Open keybord as number-keybord: </label>
<a href="#" data-role="button" data-mini="true" id="keybord-as-numbers">Number</a>

此JQuery腳本使用replaceWith來替換按鈕單擊時的輸入標簽，因此將類型設置為number

<script>
$(function(){
    //onClick: keybord-as-numbers
    $("#keybord-as-numbers").click(function(){
        $("#regnr").replaceWith("");
        $("#div-searchnumber").html('<input type="number" class="searchnumber" data-icon="search" name="regnr" maxlength="4" id="regnr" value="" data-inline="true" autofocus /\>');
    });
});
</script>

問題是，它刪除CSS樣式和我不能.get從價值html-input ，后replaceWith功能是唐。

我嘗試使用$('#regnr').attr('type', 'number'); 但這看起來不像這樣:(

Answer 1

查看http://www.texotela.co.uk/code/jquery/numeric/

您只需更改您的班級ID並在頁面上顯示以下代碼即可：

$(document).ready(function(){
    $(".numeric").numeric();
});

如果您不想使用jQuery，則可以編寫自己的函數並將其稱為onkeyup事件

請參閱： http : //www.htmlcodetutorial.com/forms/index_famsupp_158.html

另一種選擇是使用step屬性：

http://www.w3.org/TR/html-markup/input.number.html#input.number.attrs.step.float

<input type="number" step="0.01" min="0" >