2011-07-24 10 views
3

何らかのエラーで入力テキストボックスの色を赤に変更したいとします。私が与えたコードにはCSSスタイルシートがあり、そのスタイルシートを使用したい場合は、すべてのテキストボックスの色を赤に変えます。赤にテキストボックスの境界線の色を送信する方法ラウンドがありますか。ここでJavaScriptを使用してCSSパラメータの値を上書きする

テキスト入力

のコードされる(ここで私はちょうど赤に任意の個々のテキストボックスの色を設定するために必要な属性の種類を知りたい、私はエラーのためにどのように見えるか心配していないです)
<input name="count" 
type="number" 
walked="true" 
autocomplete="off" 
class="htmlplusinput numberinput novalue" 
style="width: 24px; " 
id="htmlplusinputnumberinput19" 
hasobj="true" 
novaluedisplay="number"> 

ここでは、IDが動的に変更されるため、このテキストボックスにアクセスするためにidを使用しないでください。 (私はid htmlplusinputnumberinput19は他の時間htmlplusinputnumberinput789になると言うことを意味します) それはなぜ私が他のいくつかのパラメータを使用することができる場合、より良い解決策になります。ここで

は、そのIDによる以外の入力要素を選択する方法についてのアドバイスを与えるために、ページ上のすべての入力テキストボックス

input[type="text"], .htmlplusinput { 
    border: 1px solid gray; 
    } 
+0

あなたの質問を明確にする場合は、より良いレスポンスをゲッタリングのでしょうか?他の非標準的な(歩いているなどの)ものは何ですか?属性などを調べるだけで入力が間違っているかどうかを知る方法はありますか? – dtech

+0

応答をありがとう...私はエラーを見て心配していない..私はちょうどtextinputボーダーの色を変更したい...上記のCSSコードを追加しました.. – Judy

+0

次に、グレー "を赤色またはjavascriptに変換します。document.getElementsByTagName.each(function(input){input.style.borderColor = 'red'}); (ECMAScript5しかし古いJavaScriptで簡単に) – dtech

答えて

6

に適用されるCSSスタイルシートである、あなたがする必要がありますページのマークアップに関する詳細情報を提供します。

$('#example-form input[name=count]') 

あなたはjQueryのを使用している場合は、CSSの属性値を設定することは簡単です::

$('input[name=count]').css('border-color', 'red'); 

また、あなたが要素にエラークラスを追加することがあります。

$('input[name=count]').addClass('error'); 
それはこのようなものでも動作します
+0

ありがとう...あなたはjavascriptで答えを与えることができます...コードはまたjavascriptであり、私はjqueryを知らない:( – Judy

+0

Judy、jQueryはJavaScriptライブラリです –

+0

Judy、jQueryライブラリをページに含めることは可能でしょうか?多くのメリットがありますが、そうでない場合は教えてください。 – Alp

5

@ Judy私が推測する最良の方法は、あなたの検証コードが問題の要素のIDを指摘することです。だから、そのようないくつかのjQueryを使うことができます$('#myElementId').css('border-color', 'red');

+0

ありがとう...私は本当に感謝します。あなたはjavascriptsと答えてもらえますか?..(上記のコードはjqueryの私の貧弱な理解のように見えますが)私はidで要素にアクセスする必要があります... idは動的に変化しています.. – Judy

+0

あなたが検証コードに基づいていくつかの特定の入力が「無効」または「間違っている」ことを「知っている」ことを私たちに伝える質問を明確にすることができます。 –

4

誤った入力にクラスを追加します。

CSS:

input.error { color: red; }; 

のJavascript(検証ポイント上):スタイルシートが何である:

currentValidatingInput.className += " error"; 
+0

ありがとう...ありがとうあなたはCSSスタイルシートをチェックしました... – Judy

関連する問題