0

JavaScript/HTML を使用していくつかのラジオ ボタンを検証しようとしていますが、問題があります。私が問題を抱えているスクリプトは次のとおりです-

        if ( ( RegistrationForm.sexm[0].checked == false ) && ( RegistrationForm.sexf[1].checked == false )) 
        {
            alert( "Please select your sex" ); 
            return false;
        }

基本的に、どちらのラジオボタンオプションも選択されていない場合にアラートを返したいと思っています。送信された時点で、フォームはそれ自体を更新しており、アラートを提供していません。アドバイスをいただければ幸いです。

使用するために提供された関連する HTML は次のとおりです。

<form id="RegistrationForm" onsubmit="ValidateForm()" action="">
 <fieldset>
  <legend>Registration Form</legend>
    <label for="username">User Name: </label> 
    <input type="text" class="input" id="username"/><br />
    <label for="password">Password: </label> 
    <input type="password" class="input" id="password"/><br />
    <label for="repassword">Re-Type Password: </label> 
    <input type="password" class="input" id="repassword"/><br />
    <label for="email">Email Address: </label> 
    <input type="text" class="input" size="30" id="email"/><br />
    <label>Age: </label> 
    <select id ="age" name="age">
        <option value=""> --- </option>
        <option value="0-18">0-18</option>
        <option value="18-30">18-30</option>
        <option value="30-50">30-50</option>
        <option value="50+">50+</option>
    </select><br/>
    <label for="sexm">Sex:</label>
    <input type="radio" id="sexm" name="sex" value="male" />Male<br/>
    <label for="sexf">&nbsp; </label>
    <input type="radio" id="sexf" name="sex" value="female" />Female<br/>   
    <input type="checkbox" name="agree"  id="agree" value="agree"/>
    <label for="agree">I accept the <a href="">terms and cond</a>.</label> <br/>
    <label>&nbsp; </label> 
    <input type="submit" value="Submit" class="button" /> 
 </fieldset>
</form>
4

3 に答える 3

2

JavaScript<script>タグでこのコードを試してください

function ValidateForm () {
   if ( ( document.getElementById("sexm").checked == false ) && ( document.getElementById("sexm").checked == false )) 
   {
      alert( "Please select your sex" ); 
      return false;
   } else {
      return true;
   }
}

あなたのコードに置き換えてください

if ( ( RegistrationForm.sexm[0].checked == false ) && ( RegistrationForm.sexf[1].checked == false )) 
{
    alert( "Please select your sex" );
    return false;
}
于 2013-09-30T06:49:46.373 に答える
1

ループを使用してfor、ユーザーが値を選択したかどうかを確認し、そうでない場合はアラートをスローし、return falseフォームの送信を防ぐために使用します。

デモ

var ischecked = null;
var radios = document.getElementsByName('sex');
for (var i = 0; i < radios.length; i++) {
          if (radios[i].checked) {
           ischecked = radios[i];
   }
}
if(ischecked==null) {
    alert('Please choose your Sex');
    return false;
}

上記のコードを関数に保存し、フォームの送信時に呼び出します。

デモ 2 (送信時に検証)

注：使用する必要がありますonsubmit="return ValidateForm();"

于 2013-09-30T06:49:36.380 に答える