我在题为"operatingCompany"
的第一个表格中为单选按钮值苦苦挣扎。在函数get_recommendation()
中,我处理前两个单选按钮的值(逻辑不是最有效的)。
但是,我不知道如何通过id写入逻辑/拉单选按钮值。我试图在我的get_lastOpco()
函数中执行此操作,但是我不希望使用.change
函数。
如何如何获取并处理其余三个单选按钮值?
var ESS = "Everyday Solutions";
var ILL = "ILab";
var SPP = "Spark";
var ITT = "IT Innovation";
var ES = ESS.fontcolor("red");
var IL = ILL.fontcolor("red");
var SP = SPP.fontcolor("red");
var IT = ITT.fontcolor("red");
function get_recommendation() {
$(document).ready(function() {
//Refer back to OPerating Company selection to choose between ILAB(GPC) and SPARK(APC)
var opco_selection;
var opco_selection2;
if (document.operatingCompany.opco[0].checked) {
opco_selection = document.operatingCompany.opco[0].value;
opco_selection = "ILab";
opco_selection2 = "Spark";
} else if (document.operatingCompany.opco[1].checked) {
opco_selection = document.operatingCompany.opco[1].value;
opco_selection = "Spark";
opco_selection2 = "ILab";
}
var OS = opco_selection.fontcolor("red");
var OS2 = opco_selection2.fontcolor("red");
//If Opco is checked, Both ES are not checked, ILAB/SPARK is not checked, and IT is not checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#No2').is(':checked')) && ($('#No3').is(':checked')) && ($('#No4').is(':checked'))) {
var primary = ("Not Enough Information Given");
var secondary = ("Not Enough Information Given");
}
//If Opco is checked, Both ES are not checked, ILAB/SPARK is not checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#No2').is(':checked')) && ($('#No3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + IT);
var secondary = ("Secondary Recommendation: " + OS);
}
//If Opco is checked, Both ES are not checked, ILAB/SPARK is checked, and IT is not checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#No2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#No4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + OS2);
}
//If Opco is checked, Both ES are not checked, ILAB/SPARK is checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#No2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + IT);
}
//If Opco is checked, Both ES are not checked, ILAB/SPARK is checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#No2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + IT);
}
//If Opco is checked, 2nd ES is checked, ILAB/SPARK is not checked, and IT is not checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#No3').is(':checked')) && ($('#No4').is(':checked'))) {
var primary = ("Primary Recommendation: " + ES);
var secondary = ("Secondary Recommendation: " + OS);
}
//If Opco is checked, 2nd ES is checked, ILAB/SPARK is not checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#No3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + ES);
var secondary = ("Secondary Recommendation: " + IT);
}
//If Opco is checked, 2nd ES is checked, ILAB/SPARK is checked, and IT is not checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#No4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + ES);
}
//If Opco is checked, 2nd ES is checked, ILAB/SPARK is checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#No1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + ES);
}
//If Opco is checked, 1st ES is checked, ILAB/SPARK is not checked, and IT is not checked
if (($('input[name="opco"]:checked').length > 0) && ($('#Yes1').is(':checked')) && ($('#No2').is(':checked')) && ($('#No3').is(':checked')) && ($('#No4').is(':checked'))) {
var primary = ("Primary Recommendation: " + ES);
var secondary = ("Secondary Recommendation: " + OS);
}
//If Opco is checked, 1st ES is checked, ILAB/SPARK is not checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#Yes1').is(':checked')) && ($('#No2').is(':checked')) && ($('#No3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + ES);
var secondary = ("Secondary Recommendation: " + IT);
}
//If Opco is checked, 1st ES is checked, ILAB/SPARK is checked, and IT is not checked
if (($('input[name="opco"]:checked').length > 0) && ($('#Yes1').is(':checked')) && ($('#No2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#No4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + ES);
}
//If Opco is checked, 1st ES is checked, ILAB/SPARK is checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#Yes1').is(':checked')) && ($('#No2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + ES);
}
//If Opco is checked, Both ES are checked, ILAB/SPARK is not checked, and IT is not checked
if (($('input[name="opco"]:checked').length > 0) && ($('#Yes1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#No3').is(':checked')) && ($('#No4').is(':checked'))) {
var primary = ("Primary Recommendation: " + ES);
var secondary = ("Secondary Recommendation: " + OS);
}
//If Opco is checked, Both ES are checked, ILAB/SPARK is not checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#Yes1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#No3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + ES);
var secondary = ("Secondary Recommendation: " + IT);
}
//If Opco is checked, Both ES are checked, ILAB/SPARK is checked, and IT is not checked
if (($('input[name="opco"]:checked').length > 0) && ($('#Yes1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#No4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + ES);
}
//If Opco is checked, Both ES are checked, ILAB/SPARK is checked, and IT is checked
if (($('input[name="opco"]:checked').length > 0) && ($('#Yes1').is(':checked')) && ($('#Yes2').is(':checked')) && ($('#Yes3').is(':checked')) && ($('#Yes4').is(':checked'))) {
var primary = ("Primary Recommendation: " + OS);
var secondary = ("Secondary Recommendation: " + ES);
}
document.getElementById("primary").innerHTML = primary;
document.getElementById("secondary").innerHTML = secondary;
});
}
function get_lastOpco(){
$('input[type="radio"][name="opco"]').change(function(){
switch(this.id){
case 'MPC':
var primary = ("Primary Recommendation: " + IL);
var secondary = ("Secondary Recommendation: " + ES);
document.getElementById("primary").innerHTML = primary;
document.getElementById("secondary").innerHTML = secondary;
break;
}
});
}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Spigit Input Form</title>
<meta name="description" content="Spigit Input Form">
<meta name="author" content="SitePoint">
<link rel="stylesheet" href="css/styles.css?v=1.0">
<link rel="stylesheet" href="Project_File_CSS.css">
<link rel="stylesheet" href="Recommendation_Form_CSS.css">
<!--[if lt IE 9]>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="jquery_spigit.js"></script>
</head>
<body>
<script type="text/javascript" src="selection_storage_2.js"></script>
<script type="text/javascript" src="recommendation_logic_2.js"></script>
<script type="text/javascript" src="Side_Menu_Popup.js"></script>
<script type="text/javascript" src="get_recommendation_test.js"></script>
<!---------------------------------------------------------Operating Company Question----------------------------------->
<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_lastOpco(); get_recommendation(); openNav()">
</div>
<!--------------------------------------------Side Menu PopUp--------------------------------------------------------->
<div id="mySidenav" class="sidenav">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</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>
</body>
</html>
谢谢。