ここから本文です

https://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q12213348267#a516911...

cus********さん

2019/9/1504:30:29

https://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q122133482...
の続きになります

クリックにより生成されたテーブル内の数字の合計と
テーブルの数をカウントし

テーブル内の数字÷カウント数の結果をテーブルが追加する度
別フォームに表示させたいのですが
どうすればよろしいでしょうか?

<td><form name="ave1"><input type="text" id="ave1"class="ave" value="0" /> </form></td>

<td><strong>AVE</strong></td>

<td><form name="ave2"><input type="text" id="ave2"class="ave" value="0" /> </form></td>



<input type="text" id="ave1" class="ave" value="0" />

<input type="text" id="ave2" class="ave" value="0" />
各結果を表示したいです

<input type="button" class="t12" value="" onclick="makeTable('tbl3','p3')"/>

onclickに;をつけて1クリックで処理したいです

input type,text&amp;quot,td&amp;gt,ave1&amp;quot,ave&amp;quot,ave2&amp;quot

閲覧数:
36
回答数:
1
お礼:
100枚

違反報告

ベストアンサーに選ばれた回答

プロフィール画像

カテゴリマスター

glo********さん

2019/9/1510:56:32

不明な部分も多々ありますが
概ねこんな感じ↓ですか???



<!DOCTYPE html>
<html>
<head>
<title>Example 3</title>
<script>
function makeTable(tblID, txtID){
    let tbl = document.querySelector("#"+tblID);
    let txt = document.querySelector("#"+txtID);
    let tr = document.createElement("tr");
    let td = document.createElement("td");
    let dv = document.createElement("dv");
    dv.contentEditable = true;
    dv.textContent = txt.value;
    td.appendChild(dv);
    tr.appendChild(td);
    tbl.appendChild(tr);
}
function calcAve(tblID){
    let tbl = document.querySelector("#"+tblID);
    let len = tbl.rows.length, sum = 0;
    for(let i = 0; i < len; i++){
        sum += +tbl.rows[i].cells[0].textContent;
    }
    document.querySelector("#ave1").value = sum/len;
    document.querySelector("#ave2").value = sum/len
}
</script>
</head>
<body>

<table border="1">
<tr>
<td>
<form name="ave1">
<input type="text" id="ave1" class="ave" value="0" />
</form>
</td>
<td><strong>AVE</strong></td>
<td>
<form name="ave2">
<input type="text" id="ave2" class="ave" value="0" />
</form>
</td>
</tr>
</table>

<form name="p3">
<table border="1" id="tbl3">
</table>
<input type="text" name="p3" id="p3"class="t11" value="0"/>
<input type="text" name="dummy" style="display:none;">
<input type="button" class="t12" value=""
onclick="makeTable('tbl3','p3');calcAve('tbl3')"/>
</form>

</body>
</html>

返信を取り消しますが
よろしいですか?

  • 取り消す
  • キャンセル

この回答は投票によってベストアンサーに選ばれました!

あわせて知りたい

この質問につけられたタグ

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる