- ベストアンサー
教えてください！
今、下記のような感じのソースでグラフのようなものをつくっていますが、A～Cのテキストボックスにそれぞれ数字を入力したら、その入力した数字の数だけ”☆”を表示させようとしたのですが、うまく表示されません。一つのテキストボックスだけだとうまく表示されるのですが、複数になると失敗してしまいます。ループの使い方も良くわかっていないのだと思うのですが、、表示させる方法を教えていただきたいです、お願いします。 <html> <head> <title></title> <script language="JavaScript"> <!-- function mkgrph(max){ var col; for( col =1; col <= max; col++){ document.write("☆彡"); } } //--> </script> </head> <body> <form name="form1"> <center> 数字を入力<br> A:<INPUT type="text" size="5" name="txt1"><br> B:<INPUT type="text" size="5" name="txt2"><br> C:<INPUT type="text" size="5" name="txt3"><p> <INPUT type="button" value=" グラフ " onClick="mkgrph()"> </center> </form> </body> </html>
- tohiyo
- お礼率63% (57/90)
- JavaScript
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
>この星を縦に表示することはできないのでしょうか？？ 縦に表示とは、縦に並べると言うことですか？ >＿＿＿＿＿＿＿＿＿＿＿＿ >A｜☆☆ | >B｜☆☆☆☆☆ | >C｜☆ | >￣￣￣￣￣￣￣￣￣￣￣￣ >という感じに表示させたいと思っています。 横ではないのでしょうか？？？ 一応、以下のようなイメージで変更しています。 ｜－－－－－｜ ｜Ａ｜Ｂ｜Ｃ｜ ｜－｜－｜－｜ ｜☆｜☆｜☆｜ ｜☆｜☆｜ ｜ ｜ ｜☆｜ ｜ ｜ ｜☆｜ ｜ ｜ ｜☆｜ ｜ ｜ ｜ ｜ ｜ ｜－－－－－｜ <html> <head> <title></title> <script language="JavaScript"> <!-- function mkgrph() { var col, max; document.form1.grp1.value = ""; document.form1.grp2.value = ""; document.form1.grp3.value = ""; max = document.form1.txt1.value; if (max == null) {max = 0;} for ( col = 1; col <= max; col++) { document.form1.grp1.value += "☆\n"; } max = document.form1.txt2.value; if (max == null) {max = 0;} for ( col = 1; col <= max; col++) { document.form1.grp2.value += "☆\n"; } max = document.form1.txt3.value; if (max == null) {max3 = 0;} for ( col = 1; col <= max; col++) { document.form1.grp3.value += "☆\n"; } } //--> </script> </head> <body> <form name="form1"> <center> 数字を入力<br> A:<INPUT type="text" size="5" name="txt1"><br> B:<INPUT type="text" size="5" name="txt2"><br> C:<INPUT type="text" size="5" name="txt3"><p> <INPUT type="button" value=" グラフ " onClick="mkgrph()"> </center><p> <table border=1 align=center> <tr> <td align=center>A</td> <td align=center>B</td> <td align=center>C</td> </tr> <tr> <td align=center><textarea cols=2 rows=10 name="grp1" style="overflow-y:hidden;border:none"></textarea></td> <td align=center><textarea cols=2 rows=10 name="grp2" style="overflow-y:hidden;border:none"></textarea></td> <td align=center><textarea cols=2 rows=10 name="grp3" style="overflow-y:hidden;border:none"></textarea></td> </tr> </table> </form> </body> </html>
その他の回答 (2)
- BlueRay
- ベストアンサー率45% (204/453)
簡単に書けば以下の通りかな？ <html> <head> <title></title> <script language="JavaScript"> <!-- function mkgrph() { var col, max; document.form1.grp1.value = ""; document.form1.grp2.value = ""; document.form1.grp3.value = ""; max = document.form1.txt1.value; if (max == null) {max = 0;} for ( col = 1; col <= max; col++) { document.form1.grp1.value += "☆"; } max = document.form1.txt2.value; if (max == null) {max = 0;} for ( col = 1; col <= max; col++) { document.form1.grp2.value += "☆"; } max = document.form1.txt3.value; if (max == null) {max3 = 0;} for ( col = 1; col <= max; col++) { document.form1.grp3.value += "☆"; } } //--> </script> </head> <body> <form name="form1"> <center> 数字を入力<br> A:<INPUT type="text" size="5" name="txt1"><br> B:<INPUT type="text" size="5" name="txt2"><br> C:<INPUT type="text" size="5" name="txt3"><p> <INPUT type="button" value=" グラフ " onClick="mkgrph()"> </center><p> <table border=1 align=center> <tr> <td>A:</td> <td><input type=text size=20 name="grp1" style="border:none"></td> </tr> <tr> <td>B:</td> <td><input type=text size=20 name="grp2" style="border:none"></td> </tr> <tr> <td>C:</td> <td><input type=text size=20 name="grp3" style="border:none"></td> </tr> </table> </form> </body> </html>
補足
この星を縦に表示することはできないのでしょうか？？
- mantaro1
- ベストアンサー率48% (19/39)
このままですと、mkgrph関数の引数に何も指定されていないので、関数自体はとおりますが、maxの値が0になってしまうので、何も表示されません。 例えば A:2 B:5 C:1 と入力した場合、どういう表示がされればいいか、教えて下さい。
お礼
ありがとうございました。
補足
＿＿ A:|2 | ￣￣ ＿＿ B:|5 | ￣￣ ＿＿ C:|1 | ￣￣ と入力したら、可能であればテーブルを使って ＿＿＿＿＿＿＿＿＿＿＿＿ A｜☆☆ | B｜☆☆☆☆☆ | C｜☆ | ￣￣￣￣￣￣￣￣￣￣￣￣ という感じに表示させたいと思っています。 どうでしょうか？
お礼
活用させていただきました。ありがとうございました。