Question

让我解释一下我遇到的问题：

我有3个单选按钮，当我点击1个单选按钮时，根据我选择的单选按钮显示2,3或4个div显示

<input type="radio" name="reason" id="1" value="1" class="trigger" data-target=".term1, .term2, .term3" />
<label for="1">reason1</label> 

<input type="radio" name="reason" id="2" value="2" class="trigger" data-target=".term1" />
<label for="1">reason2</label> 

<input type="radio" name="reason" id="3" value="3" class="trigger" data-target=".term1, .term2" />
<label for="1">reason3</label> 



<div class="term1">
<input type="checkbox" name="term1" value="1" id="term1" /><label for="term1" class="termlabel">term1</label>
</div>

<div class="term2">
<input type="checkbox" name="term2" value="1" id="term2" /><label for="term2" class="termlabel">term2</label>
</div>

<div class="term3">
<input type="checkbox" name="term3" value="1" id="term3" /><label for="term3" class="termlabel">term3</label>
</div>

收音机和复选框被放入一个表单，其中有一个javascript检查该表单的提交。

<form action="#" method="POST" name="frm" onsubmit="return validate();">

这是我制作的javascript文件。

function validate()
{
   if( document.frm.reason.value == "" )
   {
     alert( "Please provide your reason of visit!" );
     return false;
   }

   if( document.frm.reason.value == "1" && document.getElementById("term1").checked == true && document.getElementById("term2").checked == true && document.getElementById("term3").checked == true )
   {
   return( true );
   }
   else 
   {
   alert( "Please accept all of the terms!" );
   return false;
   }

   if( document.frm.reason.value == "2" && document.getElementById("term1").checked == true )
   {
   return true ;
   }
   else 
   {
   alert( "Please accept all of the terms!" );
   return false;
   }

   if( document.frm.reason.value == "3" && document.getElementById("term1").checked == true && document.getElementById("term2").checked == true )
   {
   return true ;
   }
   else 
   {
   alert( "Please accept all of the terms!" );
   return false;
   }

 return( true );
}

我遇到的问题是它在单选按钮上进行了验证，但在条目复选框上却没有。即使选中了正确的复选框，它仍然要求接受这些条款......有没有人看到我犯的错误？我在php方面比较好，但javascript仍然是其他东西......

Answer 1

你的

document.frm.reason

是字段的集合，因此您无法立即获得其价值。 document.frm.reason.value将返回'undefined'

使用ID

直接获取字段

document.getElementById('1').checked

像这样：

if(
    document.getElementById('1').checked && 
    document.getElementById("term1").checked &&
    document.getElementById("term2").checked && 
    document.getElementById("term3").checked) 
{
    return( true );
}
else 
{
    alert( "Please accept all of the terms!" );
    return false;
}

或使用

document.frm.reason[0].checked

您的代码中也存在逻辑错误：您无法通过第一个if / else，因为该部分将始终返回true或false。因此，如果不检查第一个原因，您将始终获得alert( "Please accept all of the terms!" );。

您需要将这些语句放在一个大的if / else语句中

这是一个工作小提琴：http://jsfiddle.net/KRUX4/

复选框验证多个div

1 个答案: