- 締切済み
HTMLでの表の作成
下記の表をHTMLで作成しないといけないのですがどうすればよろしいでしょうか。計算のところはそれぞれJavaScriptを使って加算～除算までを表の横に並んでいる2つの数字を使ってon C lickのイベントハンドラを使って作らないといけません。（上から二段目左から四行目のところだとa0の24とb0の12をJavaScriptで足し算の答えの36ができるようなJavaScriptを作る必要があります。） <script> var a = new A rray(3); var a = new Array(3); a[0]=24; a[1]=100; a[2]=123; b[0]=12; b[1]=10; b[2]=41; に続くようにお願いします。 宜しければHTMLで回答していただけると幸いです。 よろしくお願い致します。
- tsuyakus
- お礼率0% (0/8)
- JavaScript
- 回答数4
- ありがとう数1
- みんなの回答 （4）
- 専門家の回答
みんなの回答
- babu_baboo
- ベストアンサー率51% (268/525)
何かの課題の回答は斬新だとウケると思います。 実質３行で収まりました。その後の評価が知りたいです。 <style> tr:first-of-type *, td:first-of-type { background:#86f;width: 4em; } td{text-align: center;} </style> <body> <table border="1" id="T"></table> <script> var a = new Array(3); var b = new Array(3); a[0]=24; a[1]=100; a[2]=123; b[0]=12; b[1]=10; b[2]=41; let p=Object.assign(document.createElement ('input'),{type:'button',value:'計算'}); a.reduce((n,a,i)=>[...n,[i,a,b[i],...'....']],['添字,a,b,加算,減算,乗算,除算'.split`,`]).forEach(n=>n.reduce((t,i)=>(i=='.'?t.insertCell().appendChild(p.cloneNode(!0)):t.insertCell().textContent=i,t),T.insertRow())); T.addEventListener ('click',({target:e},a,b)=> 'button'!=e.type || ([,a,b]=Array.from(e.closest('tr').querySelectorAll('td'),e=>Number(e.textContent)), alert([,,,a+b,a-b,a*b,a/b][e.closest('td').cellIndex])) ); </script>
- okwavey6
- ベストアンサー率17% (99/553)
>下記の表をHTMLで作成しないといけないのですがどうすればよろしいでしょうか。 まず、どう考えても技術者ではないだろうから、作成しないといけない理由を正直に書けば、同情で回答してもらえるかもひれないので、そうしたら良いですよ。 その前に、質問を正しく出来るように考えましょう。 >計算のところは 計算のところ？計算と表示されているボタンのこと？実際に計算する処理のこと？他にもあるかもしれないけど、何のことを言っているのか明確に。１つしか意味を持たないように説明しなければいけません。 >それぞれJavaScriptを使って加算～除算までを 別に、減算や乗算は、加算と除算の間のものと言う意味はないですよ。 加算～除算までの計算ボタンだったらわかりますけど。 >表の横に並んでいる2つの数字を使って はい。 >on C lickのイベントハンドラを使って作らないといけません。 「on C lick」？オンシーリックと読めば良いですか？ 勝手にないものを作らない。 「onClick」と書いてオンクリックです。 >（上から二段目左から四行目のところだとa0の24とb0の12をJavaScriptで足し算の答えの36ができるようなJavaScriptを作る必要があります。） まず、何の話ですか？ 添付ファイルの表の、と断らなければいけません。 次に、行の使い方がおかしく、段は使いません。 項目を含めて二行四列目と言います。 また、a0？a[0]ではないの？b0でもなくb[0]ではないの？ 認識や説明がはちゃめちゃです。 スクリプト自体にも同様の問題があります。 「A rray(3)」？「Array(3)」ですよね？ >に続くようにお願いします。 だから続かずにそこでエラーが起きて終了です。何も続きません。 【あなたが作成するのは何ですか？】 これだけはしっかり説明出来ないと、教えてもらうことさえ出来ません。 HTMLで表は作れますね。 表示するだけです。 JavaScriptでスクリプトは書けますね。 そのスクリプトでHTMLの表を作ることも出来ますね。 添付画像と説明でどう解釈してもわからないところとして、計算結果をどうやって出力するの？ 計算ボタンを押したら、どうなるの？ 計算結果をキャラクターが出て来て読み上げたら良いの？ 画面中央にポップアップして表示したら良いの？それとも、表のどこかに表示するの？ 分からないから、どうしようもないし出力しないから、計算する意味もないと思います。
- asciiz
- ベストアンサー率70% (6638/9405)
うーん、なんだか、学校で出された宿題か何かですか? それだったら、自分で考えて、書いて、動かしてみて、修正して…と自分の手を動かしてみなければ、自分で組む力がつかないと思うのですが。 自分ではどこまでできたでしょうか。 例えば、配列aに3つの値を入れて、その数だけtable表を出力する、ボタンを押されたらその値を(alert通知で)表示する、というJavascript(を含むHTMLファイル)は以下のような感じになります(一例)。 これを改造していけば、回答の一つになると思いますがどうでしょう。 ----以下をhtmlファイルとして保存---- <html> <head> <title>array test</title> <script> <!-- 定数定義 --> var a = new Array(3); a[0]=24; a[1]=100; a[2]=123; </script> <script> function buttonClick(x) { alert(x); } </script> </head> <body> <!-- ヘッダ部分 --> <table border> <tr><th>添字</th><th>a</th><th>表示</th></tr> <!-- 内容部分、繰り返し --> <script> for (var i = 0; i < a.length; i++) { document.write('<tr>'); document.write('<td>' + i + '</td><td>' + a[i] + '</td>'); document.write('<td><input type="button" value="表示" onclick="buttonClick(a[' + i + '])"></td>'); document.write('</tr>'); } </script> </table> </body> </html> ----ここまで----
- bya00417
- ベストアンサー率35% (56/158)
JavaScript を HTML で答えると言うのは無理がある。 英語を日本語で教えてくれと言っているようなものです。
関連するQ&A
- 自動で表作成
ぜひご教授ください。 以前、問合せていただいたものの延長です http://oshiete1.goo.ne.jp/kotaeru.php3?q=2261428 データをhtmlに、ジャバスクリプトで表にしようとしていて、ジャバスクリプトファイル(a.js)とデータは別ファイル化(b.jsとc.js)することを前提にしています。 いざ作りはじめたところ、データが多いことがわかったので、表を２列にしたものにできないか、と考えたのですが、その場合、a.jsはどのように書き込めばよいのか、皆目検討がつきません。 よろしくお願いします。 ちなみに、今現在の状況はこうなっています。 a.js↓ html = '<TABLE cellpadding="3" cellspacing="2" width="100%">' for (i=data.length-1;i>=0;i--) //昇順： for (i=0;i<data.length;i++) //降順： for (i=data.length-1;i>=0;i--) { html += ' <TBODY><TR>' html += ' <TD bgcolor="#ffffff" onmouseover="this.style.backgroundColor='#8b0000'" onmouseout="this.style.backgroundColor=''"> ' html += ' <TABLE width="100%" cellpadding="1" cellspacing="0" bgcolor="#ffffff"> ' html += ' <TBODY><TR> ' html += ' <td><a href= ' +link[i]+' >' html += ' '+data[i]+ ' </td>' html += ' </tr></tbody></table>' html += ' </td></tr></tbody>' } html += '</table>' //書き出し document.write( html ) b.js↓ var data = new Array() data[50] = "aaaaa" data[49] = "bbbbb" ↓ data[0] = "xxxxx" c.js↓ var link = new Array() link[50] = "049.html" link[49] = "048.html" ↓ link[0] = "001.html"
- ベストアンサー
- JavaScript
- 2つの配列を比較し、3つ目の配列に入れた後にソートする方法
javascriptでとある人口の表を作成しようとしています。 そこで、２つの配列を比較して、同じ県名であれば数値を加算して3つ目の配 列に格納し、同じ県名がなかった場合はそのまま3つ目の配列に格納した後、 人口の多い場所から順に並べていくという方法が思いつきません。 （sort関数をどのように使用すればよいのかもわかりません。） var list1[0] = new Array("熊本",100); var list1[1] = new Array("長崎",200); var list1[2] = new Array("佐賀",300); var list1[3] = new Array("宮崎",450); var list2[0] = new Array("熊本",100); var list2[1] = new Array("長崎",200); var list2[2] = new Array("佐賀",300); var list2[3] = new Array("鹿児島",500); という形の2つの配列があった場合 var list3[0] = ["佐賀",600]; var list3[1] = ["鹿児島",500]; var list3[2] = ["宮崎",450]; var list3[3] = ["長崎",400]; var list3[4] = ["熊本",200]; 最終的にはこのような形になるようにしたいです。 どうか教えていただけないでしょうか。 よろしくお願いします。
- 締切済み
- JavaScript
- JavaScriptで取得した値について
初めまして、Etizenと言います。 早速質問なのですが、JavaScriptで 例えば、 <SCRIPT LANGUAGE="JavaScript"> <!-- var QS = new Array; if (location.search.length > 1) { var m_Array = location.search.substr(1).split("&"); for (idx in m_Array) { QS.push(m_Array[idx].split("=")); } } //--> </SCRIPT> という、配列でデータを取得した場合にこれを、HTMLの <input type="text" name="STFCD" Value> のValueの中に仕込むことは可能でしょうか？ よろしくお願い致します
- 締切済み
- JavaScript
- javascriptでwriteできない
カレンダーをjavascriptで作成しているのですが、以下でidocに書き込みしようとした際に、linkとbodyが書き込めずに困っております。 -------------------- var idoc = null; cal="<title>カレンダ</title><script type='text/javascript'>var arGYear = new Array('1912','1926','1989');var arGDate = new Array('19120731','19261225','19890108');var arGengo = new Array('大正','昭和','平成');var arGengoI = new Array('T','S','H');var arHoliday = new Array('20170204','20170205','20170210','20170211','20170212','20170218','20170219','20170225','20170226','20170304','20170305','20170311','20170312','20170318','20170319','20170320','20170325','20170326','20170327','20170401','20170402','20170403','20170404','20170405','20170406','20170407','20170408','20170409','20170410','20170411','20170412','20170413','20170414','20170415','20170416','20170417','20170418','20170419','20170420','20170421','20170422','20170423','20170424','20170425','20170426','20170427','20170428','20170429','20170430','20170501');</script><script type='text/javascript' src='./js/ifrmCalendar.js'></script><link href='css/ifrmCalendar.css' rel='stylesheet' type='text/css' /><body></body>"; idoc.write(cal); -------------------- 現状、IE11,cromeでの再現を確認しています。（firefoxは未試験） どのようにすれば書き込めるものでしょうか。 退職者から引き継いだPCで、退職者が使用していた際には発生していなかったのですが、私が当該PCにアカウント作成して使用するようになってから発生しております。 環境回りも確認しているのですが、それと思われるものも見つけられません。 お教え頂けますと幸いです。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- Javascriptで、以下の様な足し算をする場合、
Javascriptで、以下の様な足し算をする場合、 aからdのいずれかが空白の時には計算結果が表示されません。 いずれかが空欄の場合はその値をゼロとみなして計算結果を 表示したいのですが、記述方をご教授頂けないでしょうか。 用いる演算は、足し算と引き算のみを想定しています。 基本的な内容かとは思いますが、宜しくお願いします。 <script> var a = 1; var b = 3; var c = 5; var d = 7; document.write(a+b+c+d); </script>
- ベストアンサー
- JavaScript
- PHPの配列をjavascriptへ渡したい
PHPの配列をjavascriptの配列に渡したいのですがやり方がわかりません。 変数の渡し方ならわかるのですが配列はどう渡せばいいのでしょうか？ for文を使って渡せばいいと思うんですがどうやればいいか分かりません。 <?php $filedata=file("data.txt");//javascriptに渡したい配列 ?> <script language="javascript"> var a=new Array();//PHPの配列をこの配列に入れたい </script> 何方か教えてください。
- ベストアンサー
- PHP
- HTMLからCGI （perl）の変更
済みませんどなたか教えてください。 以下の文をHTMLで使用しているのですが。 CGI （perl）へ変更したいのですが宜しくお願いいたします。 <script language="JAVASCRIPT"> <!--var ID="123-abc";var AD=0;var FRAME=0;// --></script> <script language="JAVASCRIPT" src="http://○○○.com/l.j?id=123"></script> <noscript><A HREF="http://○○○.com/c.f?id=123"TARGET="_blank"> <IMGSRC="http://○○○.com/l.f?id=123-abc&url=X" BORDER="0"></a></noscript>
- 締切済み
- CGI
- 2つの配列を1つにするには？
var listWords1 = new Array ("a","b","c","d"); var listWords2 = new Array ("e","f"); // という2つの配列を下のような一つの配列にするにはどうすればいいですか？ var listWords3 = new Array ("a","b","c","d","e","f"); 試しに var listWords3 = new Array(); listWords3 = listWords1 + listWords2 などとやってみましたがやっぱりダメでした。(^^; またもやド素人の質問でごめんなさい。自分なりに様々なキーワードでgoogleしているのですが、基本的なことすぎるのか、なかなか答えをヒットすることができません。私のような初心者がJavaScriptを基礎の基礎から勉強できるサイトがありましたら、併せてご紹介いただけませんでしょうか？よろしくお願いいたします。m(_ _)m
- ベストアンサー
- JavaScript
- HTMLにWSHを組み込む
HTMLにWSHのコードを書く事は可能ですか？ たとえば、ページ開くとNotePad.EXEが起動するようにしたいのですが 以下のような書き方をすると WScriptが宣言されていません。 とエラーになります。 <HTML> <HEAD> <TITLE>起動のテスト</TITLE> </HEAD> <meta http-equiv="Content-Script-Type" content="text/JavaScript"> <BODY> <SCRIPT LANGUAGE="JavaScript"> var title = "メモ帳"; var wsh = WScript.CreateObject("WScript.Shell"); wsh.Run( "NotePad.EXE" ); </SCRIPT> </BODY> </HTML> いい案がある方教えてください。
- ベストアンサー
- HTML
- 画像をランダムにスクリプト
ホームページをHTMLで作成しております。画像をランダムにスクリプトしてますが、画像のサイズが大きすぎるので、HTMLでサイズ変更する場合の、HTMLをご教授ください。 width="300" height="200"を挿入でいいのでしょうか。 その場合の挿入箇所をお教えください。 現在、下記のHTMLを作成しております。 <script language="JavaScript"> <!-- var image=new Array (); image[0]="s/b/bike1.jpg" ; image[1]="s/h/hatake207.jpg"; var rnd=Math.floor(Math.random()*image.length); document.write(" <img src=' "+image[ rnd ]+ " '> "); //--> </script> 宜しくお願いします。
- 締切済み
- HTML
