/ / Exiba o numpad em dispositivos móveis sem <input type = "number"> - jquery, html, html5, mobile, webkit

Coloque o numpad em dispositivos móveis sem <input type = “number”> - jquery, html, html5, mobile, webkit

Estou criando um site que possui campos de entrada que devem permitir que você insira uma string como esta: "1-2 * 3 + 4". Também quero exibir o numpad para dispositivos móveis.

<input type="number">

Não funciona, pois os navegadores do kit da web invalidam o exemplo acima (pois contém sinais). Existem alternativas para abrir o teclado numérico diferente daquele acima? (type = "tel" não contém o sinal -)

EDITAR: Então eu encontrei uma solução alternativa:

$(".myInput").focus(function(){
$(this).get(0).type = "text";
});
$(".myInput").blur(function(){
$(this).get(0).type = "number";
});

Quando a entrada fica focada, mudo o tipo paratexto (pelo menos no iPhone, essa alteração ocorre depois que o numpad já é exibido). Quando ele perde o foco, mudo o tipo de volta para número para que funcione novamente se a entrada obtiver o foco novamente.

Ainda estou interessado em outras sugestões.

Respostas:

0 para resposta № 1

Receio que você esteja preso ao teclado numérico ou ao teclado numérico com teclas extras (que contém menos, mas não mais, infelizmente).

Para alcançar apenas o teclado numérico:

<input type="number" pattern="[0-9]*" />

Para obter o teclado numérico estendido:

<input type="number" pattern="*" />

Leia mais sobre isso na Apple "s Biblioteca de desenvolvedores Safari.