Pavé numérique pour smartphone
Bonjour,
je récupère ce script avec grand bonheur, sauf que :
1- je voudrais l'utiliser pour afficher un pavé numérique sur un smartphone ; jusque là tout va bien, j'ai rajouté un petit <meta name="viewport" content="width=device-width, height=device-height" />
2- je voudrais que la saisie s'affiche dans un seul champ (facile) sans que l'on soit obligé de donner manuellement le focus à ce champ (aïe)
3- je bidouille en php mais le java script m'est... totalement inconnu à ce jour !
Je suppose qu'une petite ligne bien placée par ceux qui savent doit résoudre mon misérable problème !
Citation:
Envoyé par
SpaceFrog
vite fait ça pourrait ressembler à ça :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
| <style type='text/css'>
td {cursor:hand;}
.up { border: outset 2 px gray;
height:20px;
width:20px;
font-family:verdana;
text-align:center;
}
.down {border: inset 2 px gray;
height:20px;
width:20px;
font-family:verdana;
text-align:center;
}
</style>
<script type='text/javascript'>
var activeinput
function populateTd(){
var tdcollection=document.getElementsByTagName('table')[0].getElementsByTagName('td')
for (i=0;i<tdcollection.length;i++){
tdcollection[i].className='up'
tdcollection[i].onmousedown=function(){this.className='down'}
tdcollection[i].onmouseup=function(){this.className='up'}
tdcollection[i].onclick=function(){if (!!activeinput){activeinput.value+=this.innerHTML}}
}
}
</script>
<title>Nouvelle page 1</title>
</head>
<body onload='populateTd()'>
<table>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td colspan=2>0</td>
<td>.</td>
</tr>
</table>
<br/>
<input type='text' onfocus="activeinput=this" /><br/>
<input type='text' onfocus="activeinput=this" /><br/>
<input type='text' onfocus="activeinput=this" /><br/>
<input type='text' onfocus="activeinput=this" /><br/>
<input type='text' onfocus="activeinput=this" /><br/>
<input type='text' onfocus="activeinput=this" /><br/>
<input type='text' onfocus="activeinput=this" /><br/>
<input type='text' onfocus="activeinput=this" /><br/>
</body> |
Une alternative toute bête
Merci pour la piste jquery, ça faisait déjà un moment que je me disais qu'il fallait s'y mettre.
Sinon pour mon pb il y a une autre solution, hyperbasique, mais finalement il faut être honnête ça correspond à mon besoin : <input type="number" /> !!!
Merci pour le coup de main...
