
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.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'; 」
の方でやってみたら、ばっちりできました。
長々とおつきあいいただいて
本当にありがとうございました。
基礎ができてないくせに、欲張りすぎかもしれません。
また何かありましたら、懲りずに書き込みさせていただきたいと思います。
よろしくお願いします。
No.2
- 回答日時:
>普通に考えると、確かにそうですよね?
>けれど、それではできなかったんです。
それほどふつうに考えた訳ではないのですが、
もっとふつうにかんがえるのならば、Form ElementsであるINPUTエリアには
bgColorという属性が存在しないのではないでしょうか?
外部ファイル云々、と書かれていますが、同一ドキュメント中に記述した場合は期待通りの動きをしたということなのでしょうか??
この回答への補足
またまたすみません。
普通という表現が良くなかったようですね。
気に障られたのでしたらすみません。
同一ドキュメント内に記述した場合については、
いろんなHPでサンプルが表示されていました。
けれども、それをどうにかして外付けにできないかなと
奮闘しているのです。
No.1
- 回答日時:
全体のソースがある訳じゃないので試しませんけど、
>objText.document.bgColor='red';
って、なにかおかしくありませんか?
これ、objTextをもとにもどすと、
document.form.tC1.document.bgColor='red';
ですよね??
「ドキュメントのフォームのtC1のあるドキュメントの背景色」
と解釈されているのでしょうか?ブラウザには。
objText.bgColor='red';
とかになるんじゃないですか?
この回答への補足
ご記入いただいてありがとうございます。
普通に考えると、確かにそうですよね?
けれど、それではできなかったんです。
で、悩んでいるのです。
なんででしょうかねぇ・・・。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
<tr>指定した表の行要素をボ...
-
その要素がjQueryでremove()済...
-
初心者です。gulpでコンパイル...
-
スマホ上で、左右スワイプで次...
-
jQueryで同じクラス名のものを...
-
<div>のタッチ状態を維持したま...
-
jQueryでシンセサイザーを作っ...
-
Colorboxがうまく設置できません
-
フォームが空欄の時にフォーム...
-
イラストレーター、縦中横のシ...
-
タグを教えてください。
-
ラジオボタンを複数選択したと...
-
jsで質問です。 formをsubmitし...
-
2025年相性がいい人のサイトの...
-
CookieをWebStoeageに変える
-
Adobe acrobat proでフォームを...
-
Outlookのアカウントがあるとメ...
-
jqueryのselect2で検索欄の文字...
-
食材の期限を管理するためにGAS...
-
ビデオのJSについて
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
jsonテキストデータの並び替え...
-
スマホ上で、左右スワイプで次...
-
viewport幅
-
ラジオボタンを複数選択したと...
-
<tr>指定した表の行要素をボ...
-
ボタンを押したあとに画像を表...
-
画面遷移を行わずに同一ページ...
-
イラストレーター、縦中横のシ...
-
GASでチェックボックスを一括of...
-
jqueryのselect2で検索欄の文字...
-
初心者です。gulpでコンパイル...
-
階層別の組織図の自動作成について
-
セレクトを全て選択されていな...
-
セレクトボックスで配列を呼び...
-
タグを教えてください。
-
jsで質問です。 formをsubmitし...
-
Adobe acrobat proでフォームを...
-
任意の変数が任意の値になった...
-
jsで質問です。 ボタンが二つ存...
-
2段階プルダウンで1段階目の選...
おすすめ情報