jQuery Mobile有數字小鍵盤嗎？

Question

我對iPad的外設，需要將焦點設置於數字字段，允許用戶輸入一個數量。

我的問題是：當我的JavaScript將焦點設置在球場上時，鍵盤不會向上滑動。

一個可行的辦法是隻丟10個按鈕在屏幕上，但在此之前我這樣做，我想我會問社區，如果一個很好的風格的鍵盤已經在jQuery Mobile的完成。

Answer 1

嘗試輸入類型設置爲：

• TYPE = 「電子郵件」
• 類型= 「URL」
• TYPE = 「電話」

或（編號：Text, Web, and Editing Programming Guide for iOS）

<input type="text" pattern="\d*"></input> 

Answer 2

更新： JSFiddle舉一個例子。 （我不是作者）

這裏是一個體面的自定義jQuery的鍵盤來看看：Simple jQuery Keypad

HTML：

<input style="background: white; color: black;" type="text" readonly="readonly" id="myInput"/> 
<table class="ui-bar-a" id="n_keypad" style="display: none; -khtml-user-select: none;"> 
<tr> 
    <td><a data-role="button" data-theme="b" class="numero">7</a></td> 
    <td><a data-role="button" data-theme="b" class="numero">8</a></td> 
    <td><a data-role="button" data-theme="b" class="numero">9</a></td> 
    <td><a data-role="button" data-theme="e" class="del">Del</a></td> 
</tr> 
<tr> 
    <td><a data-role="button" data-theme="b" class="numero">4</a></td> 
    <td><a data-role="button" data-theme="b" class="numero">5</a></td> 
    <td><a data-role="button" data-theme="b" class="numero">6</a></td> 
    <td><a data-role="button" data-theme="e" class="clear">Clear</a></td> 
</tr> 
<tr> 
    <td><a data-role="button" data-theme="b" class="numero">1</a></td> 
    <td><a data-role="button" data-theme="b" class="numero">2</a></td> 
    <td><a data-role="button" data-theme="b" class="numero">3</a></td> 
    <td><a data-role="button" data-theme="e">&nbsp;</a></td> 
</tr> 
<tr> 
    <td><a data-role="button" data-theme="e" class="neg">-</a></td> 
    <td><a data-role="button" data-theme="b" class="zero">0</a></td> 
    <td><a data-role="button" data-theme="e" class="pos">+</a></td> 
    <td><a data-role="button" data-theme="e" class="done">Done</a></td> 
</tr> 
</table> 

JS：

$(document).ready(function(){ 
    $('#myInput').click(function(){ 
     $('#n_keypad').fadeToggle('fast'); 
    }); 
    $('.done').click(function(){ 
     $('#n_keypad').hide('fast'); 
    }); 
    $('.numero').click(function(){ 
    if (!isNaN($('#myInput').val())) { 
     if (parseInt($('#myInput').val()) == 0) { 
     $('#myInput').val($(this).text()); 
     } else { 
     $('#myInput').val($('#myInput').val() + $(this).text()); 
     } 
    } 
    }); 
    $('.neg').click(function(){ 
     if (!isNaN($('#myInput').val()) && $('#myInput').val().length > 0) { 
     if (parseInt($('#myInput').val()) > 0) { 
      $('#myInput').val(parseInt($('#myInput').val()) - 1); 
     } 
     } 
    }); 
    $('.pos').click(function(){ 
     if (!isNaN($('#myInput').val()) && $('#myInput').val().length > 0) { 
     $('#myInput').val(parseInt($('#myInput').val()) + 1); 
     } 
    }); 
    $('.del').click(function(){ 
     $('#myInput').val($('#myInput').val().substring(0,$('#myInput').val().length - 1)); 
    }); 
    $('.clear').click(function(){ 
     $('#myInput').val(''); 
    }); 
    $('.zero').click(function(){ 
    if (!isNaN($('#myInput').val())) { 
     if (parseInt($('#myInput').val()) != 0) { 
     $('#myInput').val($('#myInput').val() + $(this).text()); 
     } 
    } 
    }); 
});