0

この単純な JavaScript が機能しない理由を知っている人はいますか? クラス "t1" の css を display:none から display: inline に変更して、入力が空のときに表示されるようにする必要があります onSubmit

なぜそれが機能しないのか理解できませんか?

問題がどこにあるかを見つけることができれば、どうもありがとうございます(ところで、これを純粋なjavascriptに保ちたいです)

Javascript:

function validate () {

if( document.quote.firstname.value == "" )

{document.getElementByClassName('t1').style = 'display: inline;';
   }

}   

HTML:

<form name="quote" method="post" action="" onSubmit="validate();">

<fieldset>
<legend>Contact Information</legend>

<div>
<label>*First Name:</label><span class="t1">Please enter your name</span>
<input name="firstname" type="text"/>
</div>

</fieldset>

<div id="f-submit">
<input name="Submit" value="Submit" type="submit"/>
</div>

</form>

CSS:

.t1{
display: none;
font-size:13px;
color: #F33;
text-align: right;
}   
4

2 に答える 2

1

ありませんdocument.getElementByClassName。ということgetElementsByClassNameですか?displayまた、style 属性ではなく、スタイルを直接設定する必要があります。また、フォームの送信をキャンセルする必要がある場合は、送信時に validate() を返し、キャンセルする場合は false を返す必要があります。フィドルにも入れました。

私もあなたのためにjsFiddleを作りました:http://jsfiddle.net/rgthree/g4ZvA/2/

<form name="quote" method="post" action="" onSubmit="return validate();">

JS:

function validate () {
  if( document.quote.firstname.value == "" ){
    document.getElementsByClassName('t1')[0].style.display = 'inline';
    return false;  // Return false will cancel the submit, causing the page to not load the form action action
  }
  return true;
}
于 2013-06-19T20:53:40.773 に答える