- 締切済み
次の表を作成したいと考えています。
次の表を作成したいと考えています。 なお良くわかっていませんが、jabascriptで表現したいと思います。 『 表示は全て1000桁区切り「例1,000」を自動表示させます。 自由入力欄α：a、b、c、・・・（入力規則：数字のみで半角に変換） 計算ボタンをクリックすると以下の項目が自動で表示されます。 自動計算欄β：αが100以上の入力数n βはαが100未満で0とし当該βセルを赤く表示 もしくはα×0.1×n（1000未満は切り捨て） 自動計算欄γ：α＋β 自動計算欄δ：βの合計（δ≦10,000とする。 βの合計が10,000を超えるときは10,000と表示し、γの全てのセルを黄色にする。） 自動計算欄ε：γの合計 印刷ボタンで、表のみを印刷 ※ αの項目は20以下（n≦20）の列数とし、αが未入力の場合は、β・γ項は空白表示とする。 （0表示させないという意味） 』 大変お手数ですが色々試してみたのですが、 細かい点でうまく機能できません。 お手数ですがよろしくお願いします。 『 （例） ホームページ閲覧者が α項に「12000」「800」「20000」と入力 入力規則として半角数字が適用（文字は不可）され、 α項は自動で「12,000」「800」「20,000」に変換 計算ボタンクリックで、 β項に「3,000」「0（セルは赤色）」「6,000」が表示 γ項に「15,000」「800」「26,000」が表示 δ項に「9,000」 ε項に「41,800」 』 となります。
- sikisaiyasai
- お礼率0% (0/7)
- JavaScript
- 回答数3
- ありがとう数1
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- JidousyaGaisya
- ベストアンサー率23% (45/189)
RAMディスク化用のAPPとか常駐Software・Serviceとかによる邪魔の不在証明は、 果たして可能なのでしょうか？
- kuzumiHK
- ベストアンサー率72% (132/183)
<script type="text/javascript"> function SUM(txt){ txt = han(txt); txt = txt.replace(/[^0-9、]+/, ""); var a = txt.split("、"); var b = new Array(); var c = new Array(); var d = 0; var e = 0; var atx; var btx; var ctx; var dtx; var etx; var data = document.getElementById('data'); var div = document.createElement('div'); var table = document.createElement('table'); var tb = document.createElement('tbody'); var tra = document.createElement('tr'); var trb = document.createElement('tr'); var trc = document.createElement('tr'); var trd = document.createElement('tr'); var tre = document.createElement('tr'); var len = a.length; if(len > 20){len = 20;} for(var i = 0;i < len;i++){ td_a = document.createElement("td"); if(a[i] != ""){ atx = fg(a[i]); } else{ atx = ' ' } td_a.innerHTML = atx; tra.appendChild(td_a); b[i] = a[i] * 0.1 * len; b[i] = Math.floor(b[i] / 1000) * 1000; td_b = document.createElement("td"); if(b[i] == 0){ td_b.setAttribute("class", "z"); } btx = fg(b[i]); td_b.innerHTML = btx; trb.appendChild(td_b); c[i] = parseInt(a[i]) + parseInt(b[i]); td_c = document.createElement("td"); ctx = fg(c[i]); td_c.innerHTML = ctx; trc.appendChild(td_c); d = d + parseInt(b[i]); e = e + parseInt(c[i]); } if(d >= 10000){ d = 10000; trc.setAttribute("class", "o"); } td_d = document.createElement("td"); td_d.setAttribute("colspan", len); dtx = fg(d); td_d.innerHTML = dtx; trd.appendChild(td_d); td_e = document.createElement("td"); td_e.setAttribute("colspan", len); etx = fg(e); td_e.innerHTML = etx; tre.appendChild(td_e); tb.appendChild(tra); tb.appendChild(trb); tb.appendChild(trc); tb.appendChild(trd); tb.appendChild(tre); table.appendChild(tb); div.appendChild(table); data.innerHTML = div.innerHTML; function fg(str){ var n = new String(str).replace(/,/g, ""); while(n != (n = n.replace(/^(-?\d+)(\d{3})/, "$1,$2"))); return n; } function han(str){ return str.replace(/[０-９]/g, function(str){return String.fromCharCode(str.charCodeAt(0)-65248);}); } } </script>
- kuzumiHK
- ベストアンサー率72% (132/183)
スクリプトがでかくなったので、2つに分けますね。 説明の条件がすべて満たされているかどうかわかりませんが、 こんな感じでいかがでしょうか。 <html> <head> <style type="text/css"> table{ border-collapse:collapse; width:600px; border:1px solid #000; } td{ border:1px solid #000; text-align:right; } td.z{ background:#f00; } tr.o td{ background:#ff0; } @media print{ form{ display:none; } } </style> </head> <body> <form onsubmit="SUM(this.a.value);return false;"> <input type="text" value="12000、８００、20000" name="a"> <input type="submit" value="計算"> </form> <div id="data"></div> ここにJSが入ります。 </body> </html>
