Java 計算結果の表示ボックスの書式を変えたい

2023/09/06 09:16

このQ&Aのポイント

計算結果が表示されるボックスの書式を変更したいです。
具体的には、枠線の色や太さ、枠線内の色を操作したいです。
また、任意の時間で枠線内の色を点滅させる方法も知りたいです。

ベストアンサー

Java 計算結果の表示ボックスの書式を変えたい

2015/03/20 18:46

計算結果が表示されるボックスの表示（回答(1)(2)(3)のみ）を下記のようなバリエーションで変えたいのですが、どのように記述すれば良いでしょうか。 (1)枠線の色を変えたい (2)枠線の太さを変えたい (3)枠線内（ボックス）を一定の時間で、任意の色で点滅させたい（現在は条件をつけて枠内の色が変わるように記述しています）よろしくお願い致します。 <HTML xmlns="http://www.w3.org/1999/xhtml" lang="ja"> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <TITLE>計算テスト</TITLE> </HEAD> <BODY bgcolor="#FFFFCC"> <FONT SIZE="3"> <SCRIPT language="JavaScript">  </SCRIPT> <FONT SIZE="5"><B>計算</B></font><BR> <FORM name="fk"> <FONT SIZE="3"> 　　●条件(1)：<INPUT size="7" type="text" name="d1" style="text-align:right"><BR> 　　●条件(2)：<INPUT size="7" type="text" name="d2" style="text-align:right"><BR> 　　●条件(3)：<SELECT name="s1" id="s1" onchange="b();"> <OPTION value="0.1">A</OPTION> <OPTION value="0.2">B</OPTION> </SELECT> <BR> 　　●条件(4)：<INPUT size="7" type="text" name="d3" style="text-align:right"><BR> 　　●条件(5)：<INPUT size="7" type="text" name="d4" style="text-align:right"><BR> <BR> 　　<INPUT type="button" value="計算開始" onclick="calc()"> <BR> <BR> 　　◆回答(1)：<INPUT size="7" type="text" name="calc1" style="text-align:right"><BR> 　　◆回答(2)：<INPUT size="7" type="text" name="calc2" style="text-align:right"><BR> 　　◆回答(3)：<INPUT size="7" type="text" name="calc3" style="text-align:right"><BR> <BR> </FONT> </FORM> </BODY> </HTML>

noname#245585

JavaScript
回答数1
ありがとう数1

みんなの回答 （1）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

byDesign
ベストアンサー率75% (45/60)

2015/03/20 19:54 回答No.1

まず、言語はjavaではなくjavascriptなので間違わないようにしましょう。（javaとjavascriptは別物です） (1)枠線の色を変えたい style.borderColor = "#FF0000"; (2)枠線の太さを変えたい style.borderWidth = "10px"; (3)枠線内（ボックス）を一定の時間で、任意の色で点滅させたい setInterval と clearIntervalについて調べてみると良いと思います

質問者

お礼 2015/03/21 09:43

byDesignさんご回答ありがとうございます。すみません。基本が判っていないので簡単なものも出来上がるのに時間が掛かってしまいます。基礎から勉強していきます。記述は下記のような感じにしてみました。 ◆回答(1)：<INPUT size="7" type="text" name="calc1" style="border-color:#ff0000; border-width:2px; border-style:groove; background-Color:#FF9999; text-align:right"><BR> ◆回答(2)：<INPUT size="7" type="text" name="calc2" style="border-color:#002bff; border-width:1px; border-style:dashed; text-align:right"><BR> ◆回答(3)：<INPUT size="7" type="text" name="calc3" style="border-color:#ff8000; border-width:3px; border-style:solid; text-align:right"><BR> setInterval と clearInterval については、もう少し調べてみます。ありがとうございました。m(_ _)m

関連するQ&A

Javaで計算結果によって文字色を変えたい
下記のような計算プログラムを検討しています。全くの素人なので、ネットで参考になるものを探して、やっとここまで出来ました。計算結果の値によって文字色を変えたいのですが上手くいきません。例えば、数値が100以上であれば青、200以上であれば、赤・・・というように設定したいのですが、どのように記述すれば良いでしょうか。よろしくお願い致します。 <HTML> <HEAD> <TITLE>計算</TITLE> </HEAD> <BODY> <SCRIPT language="JavaScript">  </SCRIPT> <H3>TEST</H3> <FORM name="fk">※ 条件を入力して下さい <BR> <BR> 条件(1)<SELECT name="s1" id="s1" onchange="b();"> <OPTION value="0.2">A</OPTION> <OPTION value="0.9">B</OPTION> </SELECT> <BR> 条件(2)<INPUT size="10" type="text" name="d1" style="text-align:right"><BR> 条件(3)<INPUT size="10" type="text" name="d2" style="text-align:right"><BR> 条件(4)<INPUT size="10" type="text" name="d3" style="text-align:right"><BR> 条件(5)<INPUT size="10" type="text" name="d4" style="text-align:right"><BR> <BR> <INPUT type="button" value="計算開始" onclick="document.fk.calc1.value=keisan1(document.fk.d1.value,document.fk.d2.value);document.fk.calc2.value=keisan2(document.fk.d1.value,document.fk.d2.value,document.fk.d3.value,document.fk.d4.value,document.fk.s1.value);document.fk.calc3.value=keisan3(document.fk.d1.value,document.fk.d2.value);"> <BR> 回答(1)<INPUT size="10" type="text" name="calc1" style="text-align:right"> <BR> 回答(2)<INPUT size="10" type="text" name="calc2" style="text-align:right"> <BR> 回答(3)<INPUT size="10" type="text" name="calc3" style="text-align:right"> </FORM> </BODY> </HTML>
- ベストアンサー
- JavaScript
入力する条件によって文字色・背景色を変えたい
JavaScriptで、入力する数字の条件によって文字色や背景色を変えたいのですが、どのように記述すれば良いでしょうか。例えば、条件(1)のボックスに入力する数字が100以上の時に、文字色を「白」、背景白を「赤」にしたいのです。よろしくお願い致します。 <HTML xmlns="http://www.w3.org/1999/xhtml" lang="ja"> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <TITLE>計算テスト</TITLE> </HEAD> <BODY bgcolor="#FFFFCC"> <FONT SIZE="3"> <SCRIPT language="JavaScript">  </SCRIPT> <FONT SIZE="5"><B>計算</B></font><BR> <FORM name="fk"> <FONT SIZE="3"> 　　●条件(1)：<INPUT size="7" type="text" name="d1" style="text-align:right"><BR> 　　●条件(2)：<INPUT size="7" type="text" name="d2" style="text-align:right"><BR> 　　●条件(3)：<SELECT name="s1" id="s1" onchange="b();"> <OPTION value="0.1">A</OPTION> <OPTION value="0.2">B</OPTION> </SELECT> <BR> 　　●条件(4)：<INPUT size="7" type="text" name="d3" style="text-align:right"><BR> 　　●条件(5)：<INPUT size="7" type="text" name="d4" style="text-align:right"><BR> <BR> 　　<INPUT type="button" value="計算開始" onclick="calc()"> <BR> <BR> 　　◆回答(1)：<INPUT size="7" type="text" name="calc1" style="border-color:#000000; border-width:1px; border-style:solid; text-align:right"><BR> 　　◆回答(2)：<INPUT size="7" type="text" name="calc2" style="border-color:#000000; border-width:1px; border-style:solid; text-align:right"><BR> 　　◆回答(3)：<INPUT size="7" type="text" name="calc3" style="border-color:#000000; border-width:1px; border-style:solid; text-align:right"><BR> <BR> </FONT> </FORM> </BODY> </HTML>
- 締切済み
- JavaScript
超初心者です。buttonをselectに変えるには？
<SCRIPT language="JavaScript"> function calc1(){document.keisan.Z.value=eval(document.keisan.X.value)*1;} function calc2(){document.keisan.Z.value=eval(document.keisan.X.value)*2;} function calc3(){document.keisan.Z.value=eval(document.keisan.X.value)*3;} </SCRIPT> </head> <FORM name="keisan" > <INPUT type="text" name="X" size="4"> <INPUT type="text" name="Z" size="6"> <INPUT type="button" value="1" onClick="calc1()"> <INPUT type="button" value="2" onClick="calc2()"> <INPUT type="button" value="3" onClick="calc3()"> <INPUT type="reset" value="やりなおし"> </FORM> これの INPUT type="button"を<select>～<select> に変えたいと思っています。自分の頭ではいろいろやってもうまくいきませんでした。どなたか御教授を宜しくお願い致します。
- ベストアンサー
- JavaScript
初めて書いたけど、動かないｗ
いろいろjsのサンプルとか見てて作れそうと思って作ったんですが、動きませんもしかしたらjs以前の問題かもしれませんがエラーではdocument.x1.x2がnullだとか・・めちゃくちゃなものかもしれないですが、見てくださいおねがいします --------------------------- <html> <head> <script type="text/JavaScript"></script> </head> <body> <form neme="x1"> 計算します<br/> <input name="x2" type="text" value="1"> + <input name="x3" type="text" value="2"> <input type="button" value="=" onClick="keisan()"> </form> </body> </html>
- ベストアンサー
- JavaScript
java 計算フォームで未入力の場合ゼロとしたい
java を使ってweb上で計算フォームを作成していますフォームに数値が入力された場合は問題なく計算結果に反映できますが、未入力のフォームがあると計算結果が反映されません。未入力のフォームはゼロの値として計算結果を反映させたいのですが、どうしてもできなかったのでお力をお貸頂ければ助かります＞＜フォームに最初からゼロの値を入れておく方法もあるのですが、ゼロが消された場合は未入力となってしまい計算結果に反映されないので、あくまで未入力の場合はゼロとして計算結果に反映させたいと思っています。 [script LANGUAGE="JavaScript"] function calc() { var s1, s2, s3, s4, ss; s1 = eval(document.form01.txt01.value); s2 = eval(document.form01.txt02.value); s3 = eval(document.form01.txt03.value); ss = s1+s2 +s3; if(ss < 30000) document.form01.txt04.value = ss*0.3; else if(s5 >= 30000) document.form01.txt04.value = ss*0.5; } [/script] <form name="form01"> <input style= type="TEXT" name="txt01" /> <input style= type="TEXT" name="txt02" /> <input style= type="TEXT" name="txt03" /> <input onclick="calc()" type="button" value="計算する" /> <input style= type="TEXT" name="txt04" /> </form> よろしくお願いします
- ベストアンサー
- JavaScript
同じFunctionで、同じ計算させたいのですが
私は今、以下のようにここで教えていただいたプログラムを参考に組んでは見たものの、同じ行をいくつもコピペすると計算されなくなってしまいます。1行だけの計算でしようとするとうまく計算されるのですが・・・ <HTML> <HEAD> <TITLE> タイトルバーに表示されるテキスト </TITLE> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> <BODY> <FORM NAME="sum" onSubmit="SUM();return false;"> A<INPUT TYPE="text" NAME="text1" onChange="SUM()" SIZE="10"><BR> B<INPUT TYPE="text" NAME="text2" onChange="SUM()" SIZE="10"><BR> C<INPUT TYPE="text" NAME="text3" onChange="SUM()" SIZE="10"><BR> D=A+B-C<INPUT TYPE="text" NAME="text4" onChange="SUM()" SIZE="10"><BR> E<INPUT TYPE="text" NAME="text5" onChange="SUM()" SIZE="10"><BR> F<INPUT TYPE="text" NAME="text6" onChange="SUM()" SIZE="10"><BR> G=D+E+F<INPUT TYPE="text" NAME="text7" onChange="SUM()" SIZE="10"><BR> </FORM> </BODY> </HTML>
- ベストアンサー
- JavaScript
計算結果のテキスト表示
JavaScript計算式で結果を表示したいのですができません。テキストBOXには結果を入れれるのですが、テキストBOXでなく文字として結果を出したいのですがでません。以下ソースです。　19行目が表示希望箇所です。 <SCRIPT language="javascript">  </SCRIPT> <FORM name="f"> 縦<INPUT type="text" name="goods1" size="3" onChange="calc();">m * 横<INPUT type="text" name="goods2" size="3" onChange="calc();">m * 厚み<INPUT type="text" name="goods3" size="3" onChange="calc();">cm<BR> 　　　　　　60L　<INPUT type="text" name="syoukei" size="5">袋<BR> <SCRIPT language="javascript">  </SCRIPT> </FORM>
- ベストアンサー
- JavaScript
ボタンを押して計算結果を出したい
下記のもの、うまくいきません。どのようにしたらよいのでしょうか？教えてください。よろしくお願いします。 <HTML> <HEAD> <TITLE>Calculator</TITLE> <SCRIPT language = "JavaScript"> function calc(Submit){ Num1 = document.foam1.Num1; Num2 = document.foam1.Num2; Ans = document.foam1.Ans; document.foam1.Ans.value = s1 Ans s2; } </SCRIPT> </HEAD> <PRE> 数値1 演算子数値2 答え</PRE> <FORM METHOD=GET ACTION="/calc/calc.exe"> <INPUT NAME="Num1" VALUE="" onChange="calc()"> <SELECT NAME="Opr" SIZE=1 VALUE="" onChange="calc()"> <OPTION>+<OPTION>-<OPTION>*<OPTION>/</SELECT> <INPUT NAME="Num2" VALUE="" onChange="calc()"> = <INPUT NAME="Ans" VALUE="" onChange="calc()"> <INPUT TYPE="Submit" VALUE="計算"> </FORM> <H2></H2> </HTML>
- 締切済み
- JavaScript
insertRowメソッド内で計算式を書く方法
http://jsajax.com/Articles/TableInsertRow/157を参考に、[行を挿入]ボタンをクリックすると最終行の下に行が追加され、その中にテキストボックスを配置し計算を行うようにしたいと思い、下記のソースを記述しました。そして追加した行で正常に計算を行うために、insertRow内のinnerHTMLのgoods_a_3の3の部分を動的に設定したり、calc内の計算式を動的にループさせる必要があると思ったのですが、どのように記述すれば良いか分からなかったため、アドバイスいただける方がいらっしゃいましたら、ご教示の程、よろしくお願いします。 <script type="text/javascript">  </script> </head> <body> <form action="#" name="form1" id="form1"> <table id="Table1" border="1"> <tr> <td><input type="text" name="goods_a_1" size="3" value="0" onchange="calc();" />*</td> <td><input type="text" name="goods_b_1" size="3" value="0" onchange="calc();" />=</td> <td><input type="text" name="ans1" size="8" value="0" disabled="disabled" /></td> </tr> <tr> <td><input type="text" name="goods_a_2" size="3" value="0" onchange="calc();" />*</td> <td><input type="text" name="goods_b_2" size="3" value="0" onchange="calc();" />=</td> <td><input type="text" name="ans2" size="8" value="0" disabled="disabled" /></td> </tr> </table> </form> <br /> <input id="btnInsert" type="button" value="行を挿入" /> 以上、よろしくお願いします。
- ベストアンサー
- JavaScript
JavaScriptの計算式を添削してください。
250×変数Ａ＋200×変数Ｂ＋150×変数Ｃ＝合計という計算をしたくて過去の質問をヒントに自分なりに工夫して作成いたしました。（JavaScriptは超初心者）変数Ａ～Ｂには整数が入ります。自分で動作を確認したところ問題無く動くようですが、何か問題がないか心配です。これでいいのか、間違っているところがないか確認願いますでしょうか。 <HTML> <HEAD> <SCRIPT language="JavaScript">  </SCRIPT> <TITLE></TITLE> </HEAD> <BODY> <FORM name="f"><INPUT type="text" name="t1" onkeyup="calc()" value="0"><INPUT type="text" name="t2" onkeyup="calc()" value="0"><INPUT type="text" name="t3" onkeyup="calc()" value="0"> ＝ <INPUT type="text" name="t4"></FORM> </BODY> </HTML>
- ベストアンサー
- JavaScript