Question

我正在尝试创建简短的是或否单选按钮jQuery测验，在提交时显示已回答的div。

在此人对所有三个问题回答是/否并点击“提交”后，答案将显示在测验下方。如果他们对任何问题回答“是”，它将显示'#yes'选项。如果他们对任何问题回答“否”，则会显示“否”选项。我只是想不出来。

<div style="margin: 25px 0px 0px 50px;">
<form name="SurveyDemoForm" type="external" action="" method="post"  onsubmit="return OnSubmitForm();"> 

  Does your business need the ability to collect payments from your vendors?<br/><br/>
  <input type="radio" name="question-1" value="Yes" id="q1-a">Yes&nbsp;&nbsp;&nbsp;
  <input type="radio" name="question-1" value="No" id="q1-b">No<br/><br/><br/>

  Do you need to make, in any rolling three Business Days, payments more than an aggregate amount of $75,000?<br/><br/>
  <input type="radio" name="question-2" value="Yes" id="q2-a">Yes&nbsp;&nbsp;&nbsp;
  <input type="radio" name="question-2" value="No" id="q2-b">No<br/><br/><br/>

 Do you need account access for more than 10 additional users?<br/><br/>
  <input type="radio" name="question-3" value="Yes" id="q3-a">Yes&nbsp;&nbsp;&nbsp;
  <input type="radio" name="question-3" value="No" id="q3-b">No<br/><br/><br/>


  <input type="submit" id="submit" value="Submit">
</form> 
</div>

<div>
<p id="yes"><a href="#">Cash Manager Onine</a></p>
<p id="no"><a href="#">Small Business Online</a></p>
    </div>


    <script type="text/javascript"> 

     $(function() {
        var rules = ['q1-a,q2-a,q3-a']
         $('#submit').click(function() {
            $('#yes,#no').hide();
            if( $('input[name=question-1]:checked').map(function(i,v) { return v.id; }).get().join(',') == rules[0] ) {
                $("#yes").show();
             }
             else
            {   
                $("#no").show();
            }
        });
    });

    </script>

Answer 1

有很多方法可以做到这一点，但由于你的逻辑是如此简单，一个非常直观的方法是找到:checked输入，并迭代它们以查看是否需要应用“否”情况下。

http://jsfiddle.net/m68TL/

根据单选按钮选择显示/隐藏div

1 个答案: