1

これについて私を助けてください。私は次のようなJavascriptを持っています：

function calc() {
  var table = document.getElementById(tableNum);
  var rowCount = table.rows.length;
  for (var i = 0; i < rowCount; i++) {
    var totalNum[i] = document.formNum.txt1[i].value * document.formNum.txt2[i].value;
    document.getElementById('totalCalc[' + i + ']').innerHTML = totalNum;
  }
}

そしてこのようなHTML：

<table id="tableNum">    
<form name="formNum" action="" id="formNum">
<tr>
<td><input type="text" name="txt1[]" onkeyup="calc()"/></td>
<td><input type="text" name="txt2[]" onkeyup="calc()"/></td>
<td><span id="totalCalc[]"></span></td>
</tr>
</form>
</table>

入力フィールドの数は不明です。エラーはありませんが、totalCalcフィールドは空です。私が間違ったことを教えてください。ありがとう。

編集：申し訳ありませんが、両方の入力フィールドがテーブルにあることを言及するのを忘れました。編集したコードを確認してください。ありがとう。

編集：私は実際に、行の挿入ボタンをクリックして、テーブルの行数がユーザーによって定義されているデモに取り組んでいます。

編集：コードを提供してくれたTravisに感謝します。いくつかの変更を加えた後、コードは現在機能しています。ただし、最初の行のみが機能しています。行の長さを取得し、テキストフィールドのforループを使用することを考えています。<input type="text" name="txt1[<?php echo $rowLength;?>]" onkeyup="calc()"/>誰か他のアイデアがありますか？ありがとう。

4

4 に答える 4

1

これが何が起こっているかです。

HTMLファースト

これらをインデックスで参照する場合は、次のように適切なインデックスを使用してください

name="txt1[0]"
name="txt2[0]"
<span id="totalCalc[0]">

Javascript

document.getElementById(tableNum);

getElementsById文字列を期待するので、これは

document.getElementById("tableNum");

反復しているため、すぐに使用されるため (配列全体ではなく)、これらの変数の 1 つだけが必要です。

var totalNum =それ以外のvar totalNum[i]

ドット表記を使用してフォームにアクセスすると、名前の括弧が混乱するため、次のようにする必要があります。

document.formNum["txt1["+i+"]"].valueそれ以外のdocument.formNum.txt1[i].value

ヴアラ

これらのマイナーな変更を行うと、使用したコードは実際に適切な結果を生成します:) この動作デモを参照してください: http://jsfiddle.net/69Kj7/、また、2 行のデモ: http://jsfiddle.ネット/69Kj7/1/

参考までに、これはデモのコードです。

html:

<table id="tableNum">    
<form name="formNum" action="" id="formNum">
<tr>
<td><input type="text" name="txt1[0]" onkeyup="calc()"/></td>
<td><input type="text" name="txt2[0]" onkeyup="calc()"/></td>
<td><span id="totalCalc[0]"></span></td>
</tr>
</form>
</table>​

js:

function calc() {
 var table = document.getElementById("tableNum");
 var rowCount = table.rows.length;
 for (var i = 0; i < rowCount; i++) {
  var totalNum = document.formNum["txt1["+i+"]"].value * document.formNum["txt2["+i+"]"].value;
  document.getElementById('totalCalc[' + i + ']').innerHTML = totalNum;
 }
}​
于 2013-01-02T07:23:57.143 に答える
1

最初に間違っていると思われるのは

document.getElementById(tableNum);

する必要があります

document.getElementById("tableNum");

第二に、

var totalNum[i] =

する必要があります

var totalNum =

また、機能していない場合は、 firebugまたは chrome の統合開発者ツールを使用してデバッグすることで、すぐに見つけることができます。これは、構文検証にも役立ちます。

于 2013-01-02T07:03:10.550 に答える
1

純粋なJavaスクリプトで作業したい場合、ここに論理コードがあります

html

<form name="formNum" id="formNum" action="" >
<input type="text" name="foo[]" onkeyup="calc()" value="5"/>
<input type="text" name="foo[]" onkeyup="calc()" value="12"/>
<span id="totalCalc"></span>
</form>

</p>

js

var inputs = formNum["foo[]"];
var total = 1;
alert(inputs.length);
for (var i = 0; i < inputs.length; i++) {
    total *= inputs[i].value;
}

alert(total);

working DEMO

于 2013-01-02T07:24:22.020 に答える
0

私は問題を解決する方法を考え出しました。の後に配列を挿入するだけでtotalCalc、 の中に挿入することはできませんtotalCalc。

私を助けてくれてありがとうございました:)

于 2013-01-05T05:55:52.163 に答える