onClickで、テキストの背景色を変えたいのですが。
その処理を外部ファイルに記述したいのです。
HTMLファイルでは下記のように記述し、
<・・・・・
<td><input type="button" value="テキストを赤に" onClick="Col001(tC1)"><input type="text" name="tC1" size="20" value=""></td>
・・・・・>
JavaScript外部ファイルでは、
function Col001(objText){
alert(objText.value);
objText.document.bgColor='red';
}
と記述しています。
すると、ページ全体の色が変わってしまいます。
alert(objText.value);では、
テキストボックスtC1に入力されている値が
正常に表示されるのですが・・・。
テキストボックスの背景色だけを変える場合には
どのようにしたらいいのでしょうか?
どなたか教えてください。
よろしくお願いします。
No.1
- 回答日時:
全体のソースがある訳じゃないので試しませんけど、
>objText.document.bgColor='red';
って、なにかおかしくありませんか?
これ、objTextをもとにもどすと、
document.form.tC1.document.bgColor='red';
ですよね??
「ドキュメントのフォームのtC1のあるドキュメントの背景色」
と解釈されているのでしょうか?ブラウザには。
objText.bgColor='red';
とかになるんじゃないですか?
この回答への補足
ご記入いただいてありがとうございます。
普通に考えると、確かにそうですよね?
けれど、それではできなかったんです。
で、悩んでいるのです。
なんででしょうかねぇ・・・。
No.2
- 回答日時:
>普通に考えると、確かにそうですよね?
>けれど、それではできなかったんです。
それほどふつうに考えた訳ではないのですが、
もっとふつうにかんがえるのならば、Form ElementsであるINPUTエリアには
bgColorという属性が存在しないのではないでしょうか?
外部ファイル云々、と書かれていますが、同一ドキュメント中に記述した場合は期待通りの動きをしたということなのでしょうか??
この回答への補足
またまたすみません。
普通という表現が良くなかったようですね。
気に障られたのでしたらすみません。
同一ドキュメント内に記述した場合については、
いろんなHPでサンプルが表示されていました。
けれども、それをどうにかして外付けにできないかなと
奮闘しているのです。
No.3ベストアンサー
- 回答日時:
>気に障られたのでしたらすみません。
いぇ、そういうわけではありません。
ただ、私の知りうる限り、bgColorという属性を持っているのはdocumentsとlayerだけみたいなので、できないのではないか??と思ったのです。
ちなみに、同一ページ内でテストしても
objText.document.bgColor='red';
の場合IEはページ背景色がかわり、NNではエラーになりました。
よく考えると、HTMLのINPUTにもカラー関係の属性などありません。変更するにはスタイルシートを用いる必要があります。ですから、JavaScriptから操作するにしても、一度スタイルシートを介さなくてはならないのではないでしょうか?
そこで、
objText.style.backgroundColor'red';
にしてはいかがでしょう?
あと、ちょっと邪道ですが思いついたもの。
あらかじめ、変更後のデザインを適当なID(たとえばinTxt)でスタイルシートで定義しておき、JavaScriptで
objText.id = 'inTxt' ;
という風にIDを変更して定義されているIDのスタイルシートが効くようにする。
参考になればよいのですが・・・。
できましたー!!
「objText.style.backgroundColor'red'; 」
の方でやってみたら、ばっちりできました。
長々とおつきあいいただいて
本当にありがとうございました。
基礎ができてないくせに、欲張りすぎかもしれません。
また何かありましたら、懲りずに書き込みさせていただきたいと思います。
よろしくお願いします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- PHP 入力した部分を表示させたまま(保持)するにはどうすれば良いでしょうか? 1 2023/01/25 11:14
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript プログラムがうまく動きませんレビューお願いします 1 2022/07/10 05:08
- PHP PHPで画像の渡しが上手く行きません。 1 2023/02/02 09:39
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
JSのボタンを複数う使うには
-
リンクの追加
-
追加ボタンを押した際に ok ボ...
-
ページ間の値の引渡し
-
ボタンをクリックするとテキス...
-
javascriptでtextareaに文字列...
-
クリックさせたいが、click()が...
-
ボタンかリンクをクリックする...
-
オークションサイト一括検索サ...
-
ブラウザの外にあるマウスの情...
-
formのfileの値をhiddenでも持...
-
クリックでテーブル内の背景色...
-
正規表現で複数マッチ条件で悩...
-
ボタン2回押しを無効にしたい
-
<form action="#">の意味とは?
-
<td>の中のonClick="location" で
-
JavaScriptにて動的に配列を作...
-
背景色を変えて未入力チェック...
-
【jsp/Java】チェックボックス...
-
javascriptで画像の移動
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
iOSのみダブルタップが必要
-
onclickが動作しない
-
追加ボタンを押した際に ok ボ...
-
ボタンかリンクをクリックする...
-
innerHTML内では改行は禁止?
-
クリックさせたいが、click()が...
-
javaScriptの変数をJavaの変数...
-
formのfileの値をhiddenでも持...
-
JavascriptでDOM-based XSSの発...
-
クリックでテーブル内の背景色...
-
VB.NETで<Input>タグ、<text...
-
開いた子ウィンドウにあるボタ...
-
jQueryで設定したイベントハン...
-
javascriptで作成されたテーブ...
-
HTMLのテキストボックスへのド...
-
テキストフィールド未入力の場...
-
JavaScriptのfileオブジェクト...
-
JSのボタンを複数う使うには
-
オンクリックで現在時刻の取得→...
おすすめ情報