0

この 2 つのラジオ ボタンが表示されます。

このボタンをクリックすると、div が表示および非表示になります。

送信ボタンをクリックすると、検証が発生します。

div が表示されると、検証が行われます。

ただし、div が非表示の場合、検証も行われます。

非表示の div の検証を防ぐ方法。

これは私のコードです:

    <script type="text/javascript">

function checkRadio(frmName, rbGroupName)
{ 
    var radios = frmName.elements[rbGroupName]; 
    for (var i=0; i <radios.length; i++)
    { 
        if (radios[i].checked)
        { 
            return true; 
        } 
    } 
    return false; 
} 
    function chk_oauth(objForm)
   {
  var user = objForm.user.value;
  var pass = objForm.password.value;

  if(user =="")
  {
        alert("Type email");
        return false;
  }

  if(pass =="")
  {
        alert("Type pasword");
        return false;
  }

  if (!checkRadio(objForm,"oauth_option"))
  {
        alert("Please select option");
        return false;
  }
  }          
  </script>
  <form name = "frmOauth" enctype="multipart/form-data" action = "" method = "post"    onsubmit="javascript:return chk_oauth(this);">
   <label><input type="radio" name="oauth_option" id="oauth_yes" value="Yes" onclick="toggle(this)" >Yes</label>
    <label><input type="radio" name="oauth_option" id="oauth_no" value="No" onclick="toggle(this)">No</label>
     <div class="oauth_div" id="oauth_div" >
     Email Address* <br />
      <input type="text" class="input-profile-other" placeholder="Email" id="user" name="user" />
      Password * <br/>
     <input type="password" class="input-profile-other" type="password" id="password" name="password" placeholder="password" />
        </div>
       <input class="btn-home-search1" type="submit" value="Go" name="oauth_submit" id="oauth_submit">
        </form>

             <script type="text/javascript">
            var t = document.getElementById('oauth_div');

         function toggle(switchElement) {
          if (switchElement.id == 'oauth_yes'){
          t.style.display = '';
          //email.setAttribute('type','email');
             t.style.visibility = 'visible';
           }else{
            t.style.display = 'none';
             //email.setAttribute('type','text');
              t.style.visibility = 'hidden';
            }
          }

               [].forEach.call( document.forms.frmOauth.oauth_option, function(radio){
             if( radio.checked ) {
                     toggle( radio );   
             }
               });
                </script>
4

6 に答える 6

2

ここでその div のすべてのフィールドに 1 つのクラスを追加しますoauth_class

<form name = "frmOauth" enctype="multipart/form-data" action = "" method = "post" onsubmit="javascript:return chk_oauth(this);">
<label><input type="radio" name="oauth_option" id="oauth_yes" value="Yes" onclick="toggle(this)" >Yes</label>
<label><input type="radio" name="oauth_option" id="oauth_no" value="No" onclick="toggle(this)">No</label>
<div class="oauth_div" id="oauth_div" >
Email Address* <br />
<input type="text" class="input-profile-other oauth_class" placeholder="Email" id="user" name="user" />
Password * <br/>
<input type="password" class="input-profile-other oauth_class" type="password" id="password" name="password" placeholder="password" />
</div>
<input class="btn-home-search1" type="submit" value="Go" name="oauth_submit" id="oauth_submit">
</form>

Javascript

var t = document.getElementById('oauth_div');
function toggle(switchElement) {
if (switchElement.id == 'oauth_yes'){
t.style.display = '';
var temp = document.getElementByClass('oauth_class');
temp.style.display = ''
//email.setAttribute('type','email');
t.style.visibility = 'visible';
}else{
t.style.display = 'none';
//email.setAttribute('type','text');
t.style.visibility = 'hidden';
t.style.visibility = 'hidden';

}
}
于 2012-08-13T11:25:16.497 に答える
1 
function chk_oauth(objForm)
   {
if(document.getElementById('oauth_div').style.display=='none')
return;
  var user = objForm.user.value;
  var pass = objForm.password.value;

  if(user =="")
  {
        alert("Type email");
        return false;
  }

  if(pass =="")
  {
        alert("Type pasword");
        return false;
  }

  if (!checkRadio(objForm,"oauth_option"))
  {
        alert("Please select option");
        return false;
  }
  }
于 2012-08-13T11:19:55.547 に答える
1

div の「visibility」プロパティを確認するだけです。

あなたの場合、使用できます

 document.getElementById("oauth_div").style.visibility == "visible"

ただし、divがどのように隠されているかを確認したので、これはあなたのケースでうまくいくことに注意してください。「display」プロパティを none に設定したり、不透明度を 0 に設定したりするなど、div を非表示にする方法がいくつかあるため、これはすべての場合に機能するとは限りません。何かのようなもの

function isVisible(elem) {
var cmpstyle = window.getComputedStyle(elem,null);
if (parseFloat(cmpstyle.opacity) > 0 &&
cmpstyle.visibility != 'hidden' &&
cmpstyle.display != 'none') {
return true;
} else return false;
}

そう：

function chk_oauth(objForm)
{
    var oauth_div = document.getElementById("oauth_div");

if (isVisible(oauth_div)) {
                var user = objForm.user.value;
          var pass = objForm.password.value;

          if(user =="")
          {
                alert("Type email");
                return false;
          }

          if(pass =="")
          {
                alert("Type pasword");
                return false;
          }

          if (!checkRadio(objForm,"oauth_option"))
          {
                alert("Please select option");
                return false;
          }
} else { /*Do whatever you want to happen when div is hidden*/ }


}
于 2012-08-13T11:36:34.180 に答える
1

何かのようなもの

if(t.style.display == 'なし')

あなたの検証で？

于 2012-08-13T11:16:03.033 に答える
0

これらのフィールドが検証されないように、対応する入力フィールドをドキュメントから削除します。ラジオ ボタンの情報を使用して、入力フィールドをチェックする必要があるかどうかを判断できないのはなぜですか?

于 2012-08-13T11:22:53.817 に答える
0

これを試して

function chk_oauth(objForm)
   {
  var user = objForm.user.value;
  var pass = objForm.password.value;

    if(document.getElementById("oauth_div").style.visibility != "none"){
      if(user =="")
      {
            alert("Type email");
            return false;
      }

      if(pass =="")
      {
            alert("Type pasword");
            return false;
      }
    }
      if (!checkRadio(objForm,"oauth_option"))
      {
            alert("Please select option");
            return false;
      }
      }
于 2012-08-13T11:24:40.333 に答える