自作のプログラムで、
<input type="number" name="A">
<input type="number" name="B">
で、A>B なら B=A
とする。
というコードを作ったら、うまくいかない。
(jqueryの読み込みコードは省略)
<input type="number" name="A">
<input type="number" name="B">
//jquery
<script>
$(function(){
// 関数 A B を比較して、 A>B なら B=A とする
function test(){
var A=$('input[name="A"]').val(); // Aの値を取得
var B=$('input[name="B"]').val(); // Bの値を取得
if(A>B){
$('input[name="B"]').val(A); // Bの値をAの値にセット
}
}
$('input[name="A"]').change(test); // Aが変化したら 関数呼び出し
$('input[name="B"]').change(test); // Bが変化したら 関数呼び出し
});
</script>
これを実行すると、ブラウザには、ボックスA、ボックスBが表示される。
Aに数字を入力すると、A>Bの時に、BはAの値と同じ値を表示する。
10の乗数の時に不具合
不具合のパターン
1 Bに任意な値を入力した後、Aに10の乗数を直接入力
-> Bは変化しない
2 Aのスピンボタンで入力値を増減させたときに
-> 10の乗数になるときにBは変化しない
3 Aに5を入力して、Bはスピナーで数を増やしていくと、
10に届いたところで5に戻る。
以降、Bをスピナーで増数しても、延々と5~10を繰り返す。
4 1) Bに10~19、100~199、1000~1999、など整数を入力
Aをスピナーで増数すると、2に達したときに、BはAと同数(2)を表示
2) Bに20~29、200~299、2000~2999、などの整数を入力
Aをスピナーで増数すると、3に達したときに、BはAと同数(3)を表示
3) 以降、桁の左の数字が変化する時に、
桁の一番左の数字の繰り上がり数がAとなる様子。
(桁の一番左側の数字は何というのでしょうか?)
<javascript>でも同じだった。
window.addEventListener("DOMContentLoaded",function(){
function test(){
var inp1=document.getElementById('inp1');
var inp2=document.getElementById('inp2');
if(inp1.value>inp2.value){
inp2.value=inp1.value;
}
}
inp1.addEventListener('change',test);
inp2.addEventListener('change',test);
});
jqueryのコードをいじってみる。if文を削除。
↓↓↓↓↓↓↓ あなたの記事の内容
js:
js
───────
↑↑↑↑↑↑↑ 編集リクエストの内容
if(A>B){
$('input[name="B"]').val(A);
}
```
↓
$('input[name="B"]').val(A);
これで上記の不具合はなくなった。
桁の変化は、if文で判定すると不具合が出るのでしょうか?
でも、これでは目的な動作が実装できないので、
// value と min を追加
<input type="number" name="A" value="1" min="1">
<input type="number" name="A" value="1" min="1">
// 10の乗数の時だけ、別途 B に A を代入
if(A%10==0){$('input[name="B"]').val(A);}
あとは、<input type="number">で、スピナーを外せればいいのだけれど。
調べるのに時間かかりそう。もしくは不可能?
というわけで、今日は何も進められませんでした。ちゃんちゃん。