web-dev-qa-db-ja.com

AndroidのモバイルWebサイトで数字を使用してキーボードを強制する方法

モバイルWebサイトがあり、次のようなHTML input要素がいくつかあります。

<input type="text" name="txtAccessoryCost" size="6" />

サイトを WebView に埋め込んでAndroid 2.1を消費できるようにしたため、Androidアプリケーションにもなります。

このHTML input要素にフォーカスがある場合、デフォルトの文字ではなく数字でキーボードを取得することは可能ですか？

または、HTML要素に適していない場合、アプリケーション全体（ マニフェストファイル にあるもの）に設定することは可能ですか？

androidhtmlwebviewkeyboardhtml-input
83
ncakmak
<input type="number" />
<input type="tel" />

これらの両方は、入力がフォーカスを取得するときに数値キーパッドを表示します。

<input type="search" />は、追加の検索ボタンを備えた通常のキーボードを示しています

それ以外はすべて標準キーボードを表示するようです。

101
Richard Kernahan

重要な注意

これはコメントではなく回答として投稿していますが、これはかなり重要な情報であり、この形式ではより注目を集めることになるためです。

他の仲間が指摘したように、type="number"/type="tel"を使用してデバイスに数字キーボードを表示させることができますが、私はそれを強調する必要がありますこれには非常に注意する必要があります。

誰かが000222などのゼロで始まる数字を期待している場合、一部のブラウザ（デスクトップChromeなど）がサーバーに送信するので問題が発生する可能性があります222彼女が望んでいる。

type="tel"について似たようなことは言えませんが、個人的には使用していません。さまざまな電話での動作が異なるためです。 Androidで動作しない単純なpattern="[0-9]*"に限定しました

46
user907860

これは動作するはずです。しかし、Android電話でも同じ問題が発生します。

<input type="number" /> <input type="tel" />

Jquerymobile-frameworkを含めなかった場合、2種類のフィールドでキーパッドが正しく表示されることがわかりました。

しかし、本当にjquerymobileを使用する必要がある場合、その問題を解決する解決策は見つかりませんでした。

PDATE：私は、form-tagが

<div data-role="page">

数字キーパッドは表示されません。これはバグでなければなりません...

8
Jesper Grann Laursen

一部のブラウザは、入力タイプが「数値」の場合に先行ゼロをサーバーに送信します。そこで、jqueryとhtmlを組み合わせて数値キーパッドをロードし、値が数値としてではなくテキストとして送信されるようにします。

$(document).ready(function(){
$(".numberonly").focus(function(){$(this).attr("type","number")});
$(".numberonly").blur(function(){$(this).attr("type","text")});
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="numberonly">
2
Ali Sheikhpour