Javascript 未分析单选按钮值
我正在构建一个基于输入值计算点的点计算系统。 我在这个单选按钮上使用了一些jQueryUI样式,但现在总的来说,它没有加起来。 代码太长,无法在此发布,请检查此项。我读了很多遍代码;我什么也没找到 编辑:以下是我的代码的精简版本: 问题在于div part2中的单选按钮,请阅读我的评论Javascript 未分析单选按钮值,javascript,jquery,forms,jquery-ui,radio,Javascript,Jquery,Forms,Jquery Ui,Radio,我正在构建一个基于输入值计算点的点计算系统。 我在这个单选按钮上使用了一些jQueryUI样式,但现在总的来说,它没有加起来。 代码太长,无法在此发布,请检查此项。我读了很多遍代码;我什么也没找到 编辑:以下是我的代码的精简版本: 问题在于div part2中的单选按钮,请阅读我的评论 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Ty
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Quebec and Federal Immigration Points Calculator</title>
<link rel="stylesheet" href="files/jquery00.css">
<link rel="stylesheet" href="files/flexselect.css">
<link rel="stylesheet" href="files/demos000.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" type="text/javascript"></script>
<script src="files/liquidmetal.js"></script>
<script src="files/jquery.flexselect.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("select.flexselect").flexselect();
$( ".radio" ).buttonset();//here they are made into jquery ui buttonsets
$('#part1').show('slow', function() {
});
});
</script>
<script type="text/javascript">
function showAge(){
var d =document.getElementById('dob').value.split('/');
var today = new Date();
var bday = new Date(d[2],d[1],d[0]);
var age = today.getFullYear() - bday.getFullYear();
if(today.getMonth() < bday.getMonth() || (today.getMonth() == bday.getMonth() && today.getDate() < bday.getDate()))
{
t = age-1;
}
else {
t = age
}
document.getElementById('form').age.value = t;
}
</script>
<script type="text/javascript">
function compute(form)
{
var a = parseInt(document.getElementById('form').age.value, 10) || 0;
if ((18 <= a) && (a <= 35)){
q = 16;
}
else if (a == 36){
q = 14;
}
else if (a == 37){
q = 12;
}
else if (a == 38){
q = 10;
}
else if (a == 39){
q = 8;
}
else if (a == 40){
q = 6;
}
else if (a == 41){
q = 4;
}
else if (a == 42){
q = 2;
}
else if ((18 > a) || (a > 43)){
q = 0;
}
var b = parseInt(document.getElementById('form').highed.value, 10) || 0;
if (b == 1){
c = 0;
}
else if (b == 2){
c = 2;
}
else if (b == 3){
c = 4;
}
else if (b == 4){
c = 6;
}
var aos = parseInt(document.getElementById('form').selectareaofstudy.value, 10) || 0;
//here the value of the radiio button is parsed, and if nothing is selected it will default to zero
var tcfc2 = parseInt(document.getElementById('form').TCFC2.value, 10) || 0;
qt = (aos + c + q + tcfc2);
document.getElementById('total').age.value = q;
document.getElementById('total').ed.value = c;
document.getElementById('total').aos.value = aos;
document.getElementById('total').tcfc2.value = tcfc2;//here the value is displayed
document.getElementById('total').total.value = qt;//total displayed here
}
</script>
<script type="text/javascript">
function show2() {
$('#part1').hide('fast');
$('#part2').show('slow');
}
function back2() {
$('#part1').show('slow');
$('#part2').hide('fast');
}
function showTCF() {
if($('#radio1-1').is(':checked')) { alert("it's checked"); }
}
</script>
</head>
<body>
<div id="formbox">
<form id="form" name="form">
<div id="part1" style="display:none">
<div id="hidden">
<p>Your Date of Birth (format:<strong>dd/mm/yyyy</strong>)</p>
<br />
<input onBlur="compute(this.form)" onchange="showAge()" name="dob" id="dob" />
</div>
<p>Your Age</p>
<input class="sev" name="age" type="text" onMouseOver="compute(this.form)" style="font-size: 15px" value="" size="7" />
<h1>Your education</h1>
<h2>Your highest level of Education:</h2>
<select onchange="compute(this.form)" name="highed">
<option value="">Select One</option>
<option value="1">No high school diploma or general Professional</option>
<option value="2">High school general diploma +2 or 12th grade</option>
<option value="3">Postsecondary diploma 2 years general of full-time studies</option>
<option value="4">Postsecondary technical diploma 1 year of full-time studies</option>
<option value="4">Postsecondary technical diploma 2 years of full-time studies</option>
</select>
<h2>Your Area of Education:<small>(start typing..)</small></h2>
<select class="flexselect" name="selectareaofstudy">
<option value=""></option>
<option value="6">3D Animation and Image Synthesis Techniques (DCS - 3 years) </option>
<option value="6">LOADS OF OTHER VALUES HERE</option>
</select>
<br />
<br />
<INPUT class="ten" NAME="calc" VALUE="Calculate" TYPE="button" onClick="compute(this.form)">
<INPUT class="ten" NAME="calc" VALUE="Next" TYPE="button" onClick="show2()">
<br />
</div>
<div id="part2" style="display:none">
<h2>French Proficiency</h2>
<p>Have you written: <strong>TCF Quebec/ TEFaQ/ TCF/ TEF level C2- DALF C2?</strong> </p>
<div id="radio1" class="radio">
<!--These radio buttons have values of 1 and 2 but when calculated they always show up as zero, the default values.-->
<input id="radio1-1" name="TCFC2" type="radio" value="1" checked="checked" />
<label for="radio1-1">Yes</label>
<input id="radio1-2" name="TCFC2" type="radio" value="2" />
<label for="radio1-2">No</label>
</div>
<br />
<br />
<br />
<INPUT class="ten" NAME="calc" VALUE="Calculate" TYPE="button" onClick="compute(this.form)">
<table>
<tr>
<td><INPUT class="ten" NAME="calc" VALUE="Back" TYPE="button" onClick="back2()"></td>
<td><INPUT class="ten" NAME="calc" VALUE="Next" TYPE="button" onClick="show3()"></td>
</tr>
</table>
</div>
</form>
</div>
<div style="" id="totalmenu" class="port-menu-wrapper">
<form id="total">
<h3>Points For</h3>
<table>
<tr>
<td><label>Age</label></td>
<td><input class="sev" name="age" type="text" style="font-size: 15px" value="" size="7" readonly></td>
</tr>
<tr>
<td><label style="font-size: 18px">Your Education</label></td>
</tr>
<tr>
<td><label>Education 1</label></td>
<td><input class="sev" name="ed" type="text" style="font-size: 15px" value="" size="7" readonly></td>
</tr>
<tr>
<td><label>Area of Study</label></td>
<td><input class="sev" name="aos" type="text" style="font-size: 15px" value="" size="7" readonly></td>
</tr>
<tr>
<td><label style="font-size: 18px">French Proficiency</label></td>
</tr>
<tr>
<td><label>TCFC2</label></td>
<td><input class="sev" name="tcfc2" type="text" style="font-size: 15px" value="" size="7" readonly></td>
</tr>
<tr>
<td><label style="font-size:20px;"><strong>Total</strong></label></td>
<td><input class="ten" name="total" type="text" style="font-size: 20px" value="" size="10" readonly></td>
</tr>
</table>
</form>
</div>
</body>
</html>
魁北克和联邦移民积分计算器
$(文档).ready(函数(){
$(“select.flexselect”).flexselect();
$(“.radio”).buttonset();//在这里它们被制作成jquery ui buttonset
$('#part1')。show('slow',function(){
});
});
函数showAge(){
var d=document.getElementById('dob').value.split('/');
var today=新日期();
var bday=新日期(d[2],d[1],d[0]);
var age=today.getFullYear()-bday.getFullYear();
如果(today.getMonth()dd/mm/yyyy)
你的年龄
你的教育
您的最高教育水平:
选择一个
没有高中文凭或普通专业
高中普通文凭+2或12年级
大专文凭2年全日制普通教育
专上技术文凭1年全日制学习
专上技术文凭2年全日制学习
你的教育领域:(开始打字…)
3D动画和图像合成技术(DCS-3年)
这里有很多其他值
法语熟练程度
你写过:TCF魁北克/TEFaQ/TCF/TEF C2级-DALF C2吗?
对
不
要点
年龄
你的教育
教育1
研究领域
法语熟练程度
TCFC2
总计
我认为它没有链接到jquery ui,而是链接到行
var tcfc2 = parseInt(document.getElementById('form').TCFC2.value, 10) || 0;
由于有两个元素具有名为TCFC2的单选按钮,因此将使用它们创建一个数组。此外,第一个收音机的值始终为1,第二个收音机的值始终为2。您需要检查“checked”属性,而不是确定人们是否讲法语的值
var tcfc2 = document.getElementById('form').TCFC2[0].checked -0 ;
没有parseInt,因为返回“true”或“false”,所以“-0”将强制int转换
最后,我将把收音机或输入类型文本重命名为TCFC2以外的内容。(并合并您的css,将脚本和样式从html文件中取出并放入它们自己的文件中进行维护,并将您的变量命名为比a、b和c更有意义的名称…)我认为它与jquery ui没有链接,而是与行链接
var tcfc2 = parseInt(document.getElementById('form').TCFC2.value, 10) || 0;
由于有两个元素具有名为TCFC2的单选按钮,因此将使用它们创建一个数组。此外,第一个收音机的值始终为1,第二个收音机的值始终为2。您需要检查“checked”属性,而不是确定人们是否讲法语的值
var tcfc2 = document.getElementById('form').TCFC2[0].checked -0 ;
没有parseInt,因为返回“true”或“false”,所以“-0”将强制int转换
最后,我将把收音机或输入类型文本重命名为TCFC2以外的内容。(并合并你的css,将脚本和样式从html文件中取出并放入它们自己的文件中进行维护,并将你的变量命名为比a、b和c更有意义的名称…)在这里发布你的帖子,这样任何人都可以帮你解决问题。我注意到的第一件事是一些js错误:
c未定义
和show3未定义
。