Question

我试图显示输出，具体取决于选择了哪个单选按钮。有没有办法对此进行扩展：

（$（'input [name =“ opco”]：checked'）。length> 0）

包含单选按钮ID？像这样：

（$（'input [name =“ opco”] [id =“ MPC”]：checked'）。长度> 0）

此示例的HTML如下：

<section id="first" class="section">
     <div class="container">
        <form name="operatingCompany">
           <h3>1.What OPERATING COMPANY Are You Employeed With?</h3>
           <input type="radio" name="opco" id="GPC" value="GPC" >GPC</br>
           <input type="radio" name="opco" id="APC" value="APC" >APC</br>
           <input type="radio" name="opco" id="MPC" value="MPC" >MPC</br>
           <input type="radio" name="opco" id="Gulf"value="Gulf" >Gulf</br>
           <input type="radio" name="opco" id="SCS" value="SCS" >SCS</br></br>
           <!-- <input type="button" value="Display User Selection" onclick=get_opco() /> -->
        </form>
        <p id="opco_result"> </p>
        </br>
     </div>  <!---------------------------------------------------------Prototyped Question----------------------------------->
     <div class="container">
        <form name="prototyped">
           <h3>2.Has the innovation been PROTOTYPED?</h3>
           <input type="radio" name="prototyped" id="Yes1" value="Yes" >Yes</br>
           <input type="radio" name="prototyped" id="No1"  value="No" >No</br></br>
           <!-- <input type="button" value="Display User Selection" onclick=get_prototype() /> -->
        </form>
        <p id="prototyped_result"> </p>
        </br>
     </div>
     <!--------------------------------------------------------Adopted or Tested Question---------------------------->
     <div class="container">
        <form name="adopted_tested">
           <h3>3.Has the innovation been ADOPTED OR TESTED?</h3>
           <input type="radio" name="adopt" id="Yes2" value="Yes" >Yes</br>
           <input type="radio" name="adopt" id="No2"  value="No" >No</br></br>
           <!-- <input type="button" value="Display User Selection" onclick=get_adopt_test() /> -->
        </form>
        <p id="adopted_tested_result"> </p>
        </br>
     </div>
     <!------------------------------------------------------Can it make money Question------------------------------->
     <div class="container">
        <form name="makeMoney">
           <h3>4.Is this a PRODUCT OR SERVICE that can make MONEY?</h3>
           <input type="radio" name="money" id="Yes3" value="Yes" >Yes</br>
           <input type="radio" name="money" id="No3"  value="No" >No</br></br>
           <!-- <input type="button" value="Display User Selection" onclick=get_money() /> -->
        </form>
        <p id="makeMoney_result"> </p>
        </br>
     </div>
     <!------------------------------------------------IT Specific Question------------------------------------------->
     <div class="container">
        <form name="innovativeTechnology">
           <h3>5.Is your innovation an INNOVATIVE TECHNOLOGY or process that boosts the company's PRODUCTIVITY or brings additional value from a VENDOR RELATIONSHIP?</h3>
           <input type="radio" name="innovative" id="Yes4" value="Yes" >Yes</br>
           <input type="radio" name="innovative" id="No4"  value="No" >No</br></br>
           <!-- <input type="button" value="Display User Selection" onclick=get_innovative() /> -->
        </form>
        <p id="innovativeTechnology_result"> </p>
        </br>
        <input type="button" class="button" value="Submit Form" onclick="get_recommendation(); get_lastOpco(); openNav()">
     </div>
     <!--------------------------------------------Side Menu PopUp--------------------------------------------------------->
     <div id="mySidenav" class="sidenav">
        <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
        <br></br>
        <h1> Based on your selections, we recommend the following: </h1>
        <div id="myPrimarydiv" class="primarydiv">
           <a h2><span id="primary"></span></h2>
        </div>
        <br></br>
        <div id="mySecondarydiv" class="secondarydiv">
           <a h2><span id="secondary"></span></h2>
        </div>
     </div>
  </section>

jQuery：

if (($('#MPC').is(':checked')) && ($('#Yes1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#Yes4').is(':checked'))){
        var primary = ("Primary Recommendation: " + OS);
        var secondary = ("Secondary Recommendation: " + ES);
    }

这可能吗？

Answer 1

由于ID必须是唯一的，并且它们已经具有选择器，因此您可以简单地执行以下操作

if ($('#MPC').is(':checked')){
    var primary = ("Primary Recommendation: " + OS);
    var secondary = ("Secondary Recommendation: " + ES);
}

要在值更改时执行特定操作，可以在更改事件中检查当前活动单选按钮的ID

$('input[type="radio"][name="opco"]').change(function(){
    switch(this.id){
        case 'MPC':
            //Do something etc
            break;

    }
});

是否可以根据jquery中单选按钮的ID执行操作？

1 个答案: