Javaスクリプト関数での問題

Question

functionを使用して2つのテキストボックスを追加し、結果を3番目のテキストボックスに表示したいとします。このため私は2つの機能を使いました。最初のテキストボックス値を読み取る最初のgetdata()と2番目のテキストボックス値を読み取るにはgetdata1()です。私もonchangeイベントを使用します。結果としてNaNと表示されます。私を助けてください。ここ は私のコードは、異なる要素に対して同じid値を使用しないでください

var a, b, c; 
 

 
function getdata(txt) { 
 
    x = txt.value; 
 
    if (!isNaN(x)) { 
 
    a = parseInt(document.getElementById("txt").value); 
 
    } else { 
 
    alert("Input not valid"); 
 
    txt.focus(); 
 
    txt.value = ""; 
 
    } 
 
} 
 

 
function getdata1(txt) { 
 
    x = txt.value; 
 
    if (!isNaN(x)) { 
 
    b = parseInt(document.getElementById("txt").value); 
 
    } else { 
 
    alert("Input not valid"); 
 
    txt.focus(); 
 
    txt.value = ""; 
 
    } 
 
} 
 

 
function myFunction(s, t) { 
 
    var s = a; 
 
    var t = b; 
 
    var c = s + t; 
 
    document.getElementById("result").value = c; 
 
}

<td><input type="text" name="txt[]" id="txt[]" onchange="getdata(this)" /></td> 
 
<td><input type="text" name="txt[]" id="txt[]" onchange="getdata1(this)" /></td> 
 
<td><input type="text" name="result" id="result" onfocus="myFunction()" /></td>

Answer 1

です！ document.getElementById("txt").valueの代わりにxの値を使用してください。

var a, b, c; 
 
function TryParceData(src, old) { 
 
    x = src.value; 
 
    if (!isNaN(x)) { 
 
    return parseInt(x); 
 
    } else { 
 
    alert("Input not valid"); 
 
    src.focus(); 
 
    src.value = ""; 
 
    return old; 
 
    } 
 
} 
 
function getdata(txt) { 
 
    a = TryParceData(txt, a); 
 
    myFunction(); 
 
} 
 

 
function getdata1(txt) { 
 
    b = TryParceData(txt, b); 
 
    myFunction(); 
 
} 
 

 
function myFunction(s, t) { 
 
    var s = a; 
 
    var t = b; 
 
    var c = s + t; 
 
    document.getElementById("result").value = c; 
 
}

<input type="text" name="txt[]" onchange="getdata(this)" /> 
 
<input type="text" name="txt[]" onchange="getdata1(this)" /> 
 
<input type="text" name="result" id="result" onfocus="myFunction()" />

Answer 2

すべての最初のあなたは、同じIDを持つ複数の要素を持っている場合は、最初または最後はあなたの選択によってフェッチされた唯一のいずれかになります。第2に、属性 'id'は要素にIDを与えるためidと呼ばれます。基本的には各要素に同じIDを与えないようにすることを意味します。第3に、あなたがid 'txt'を持つ要素を探しているのにあなたのページに何もない（このエラーはあなたのparseInt部分で起こります）NaNを得ています。あなたの要素のidは 'txt []'です。これらのIDを他のIDの「txt1」と「txt2」に変更し、スクリプトを変更してみてください。あなたがそれを修正したら私を更新してください。歓声

Answer 3

は、あなたが理由の一つであり、同じ `id`で両方のテキストボックスを与えている

var a, b, c; 
 

 
function getdata(txt) { 
 
    x = parseInt(txt.value); 
 
    if (!isNaN(x)) { 
 
    a = parseInt(document.getElementById("txt").value); 
 
    } else { 
 
    txt.focus(); 
 
    txt.value = ""; 
 
    } 
 
} 
 

 
function getdata1(txt) { 
 
    x = parseInt(txt.value); 
 
    if (!isNaN(x)) { 
 
    b = parseInt(document.getElementById("txt1").value); 
 
    } else { 
 
    txt.focus(); 
 
    txt.value = ""; 
 
    } 
 
    myFunction(); 
 
} 
 

 
function myFunction() { 
 
    var c = a + b; 
 
    document.getElementById("result").value = c; 
 

 
}

<input type="text" id="txt" onblur="getdata(this)"> 
 
<input type="text" id="txt1" onblur="getdata1(this)"> 
 
<input type="text" id="result">