这是我的HTML代码:
<form name="dform">
<fieldset>
<input type="radio" class="yes" name="g1" value="1"/> Yes<br/>
<input type="radio" class="no" name="g1" value="0"/> No
</fieldset>
<fieldset>
<input type="radio" class="yes" name="g2" value="1"/> Yes<br/>
<input type="radio" class="no" name="g2" value="0"/> No
</fieldset>
<fieldset>
<input type="radio" class="yes" name="g3" value="1"/> Yes<br/>
<input type="radio" class="no" name="g3" value="0"/> No
</fieldset>
<input type="reset" class="reset" value="RESET"/><BR/>
</form>
<div id="result">N/A</div>
我想设置这样的值:
我已经尝试过这样的jquery脚本了:
function scoring(){
var score_yes = 0;
var score_no = 0;
$(".yes:checked").each(function()){
score_yes += parseInt ($(this).val());
});
$(".no:checked").each(function(){
score_no += parseInt ($(this).val());
});
if($(score_yes)==3){
$("#result").html('LOW');
}else if($(score_yes)==2){
$("#result").html('MEDIUM');
}else if(($(score_no)==3){
$("#result").html('HIGH');
}else if($(score_no)==2){
$("#result").html('HIGH');
}else{
$("#result").html('N/A');
}
}
$(document).ready(function(){
$(".yes:checked").change(function(){
scoring();
});
});
但它不起作用。我该怎么办?
答案 0 :(得分:1)
一些语法错误和score_yes不应该用jQuery包装
function scoring(){
var score_yes = 0;
var score_no = 0;
$(".yes:checked").each(function(){
score_yes += parseInt(this.value);
});
$(".no:checked").each(function(){
score_no += parseInt(this.value);
});
if(score_yes==3){
$("#result").html('LOW');
}else if(score_yes==2){
$("#result").html('MEDIUM');
}else if(score_no==3){
$("#result").html('HIGH');
}else if(score_no==2){
$("#result").html('HIGH');
}else{
$("#result").html('N/A');
}
}
$(document).ready(function(){
$(".yes").change(function(){
scoring();
});
});
答案 1 :(得分:1)
在几个地方的额外括号中有很多问题要将jquery对象(例如$(score_yes)
)中的int包装到.yes:checked
上的绑定(我相信你想要.yes, .no
as这两个都会改变#result
)。你也可以做一些简化。我相信这就是你想要的:
function scoring() {
var score_yes = $(".yes:checked").size();
var score_no = $(".no:checked").size();
if (score_yes == 3) {
$("#result").html('LOW');
} else if (score_yes == 2) {
$("#result").html('MEDIUM');
} else if (score_no == 3) {
$("#result").html('HIGH');
} else if (score_no == 2) {
$("#result").html('HIGH');
} else {
$("#result").html('N/A');
}
}
$(document).ready(function () {
$(".yes, .no").change(function () {
scoring();
});
});
答案 2 :(得分:1)
function scoring(){
var score_yes = 0;
var score_no = 0;
score_yes = $(".yes:checked").size();
score_no = $(".no:checked").size();
if(score_yes==3){
$("#result").html('LOW');
}else if(score_yes==2){
$("#result").html('MEDIUM');
}else if(score_no==3){
$("#result").html('HIGH');
}else if(score_no==2){
$("#result").html('HIGH');
}else{
$("#result").html('N/A');
}
}
$(document).ready(function(){
$("#dform input:radio").change(function(){
scoring();
});
});
答案 3 :(得分:1)
你可以做得更简单:
function scoring() {
var score_yes = $("input.yes:checked").length;
var score_no = $("input.no:checked").length;
if (score_no >= 2)
return 'HIGH';
else if (score_yes == 3)
return 'LOW';
else if (score_yes == 2)
return 'MEDIUM';
else
return 'N/A';
}
$(document).ready(function(){
$('input[type="radio"]').change(function(){
scoring();
});
});
答案 4 :(得分:1)
我自己的建议是:
/* caching the radio inputs, to save time later
(assuming there's a static collection):
*/
var radios = $('input[type="radio"]');
// setting up the event-handler:
radios.change(function(){
// filtering for how many '.yes' inputs are checked:
var yes = radios.filter('.yes:checked').length,
// filtering for how many '.no' inputs are checked:
no = radios.filter('.no:checked').length;
// setting the text of the '#result' element:
$('#result').text(function(){
/* assuming a binary decision, then only, at most,
half of the total number of elements can be checked, if they are
all choices have been made:
*/
if (yes + no === (radios.length)/2) {
/* if 'yes' scores more than 1 (so either 2 or 3) we return 'Low',
otherwise 'High':
*/
return yes > 1 ? 'Low' : 'High';
}
// some are unchecked, therefore we return 'N/A':
else {
return 'N/A';
}
});
// triggering the 'change' event on DOM-ready, in case of default-checked radio inputs:
}).change();
参考文献:
答案 5 :(得分:1)
您的代码中存在多个语法错误,您需要额外的{
或(
。此外,您的主要问题是更改侦听器的选择器$(".yes:checked")
仅选择已经选中的单选按钮。您可以使用$("input[type='radio']")
作为选择器来更改此设置。您可以在下面找到完整的示例
<强> DEMO 强>
$(document).ready(function () {
$("input[type='radio']").change(function () {
var score_yes = 0;
var score_no = 0;
$(".yes:checked").each(function () {
score_yes += parseInt($(this).val());
});
$(".no:checked").each(function () {
score_no += parseInt($(this).val());
});
if (score_yes === 3) {
$("#result").html('LOW');
} else if (score_yes === 2) {
$("#result").html('MEDIUM');
} else if (score_no === 3) {
$("#result").html('HIGH');
} else if (score_no === 2) {
$("#result").html('HIGH');
} else {
$("#result").html('N/A');
}
});
});
答案 6 :(得分:0)
有一个额外的括号:
$(".yes:checked").each(function() ) {
应该是
$(".yes:checked").each(function(){