Question

我有两个相当简单的JavaScript代码部分。它们都控制表单的复选框。我正在编写一个Rails应用程序，其中包含一些用户测试。如果选中其他框，我需要取消选中复选框。例如，如果选中“true”，我也不能检查“false”。进行选择时，JavaScript将取消选中其他选项。很简单。

我有两部分JavaScript代码。第一部分控制取消选中多项选择。第二部分控制取消选中真/假问题。

两段代码都有效。但是，如果我把一个放在另一个的前面，第二部分将不起作用。这种情况发生在两个方向。如果A在B的前面，B将无法工作。如果B在A前面，A将无法工作。

有人能看到导致这种情况的原因吗？救命啊！

// controls multiple choice uncheck for tests
function option1_checker(){
    if(document.getElementById('option1_checkbox').checked){
        $('#option2_checkbox').attr('checked', false);
        $('#option3_checkbox').attr('checked', false); 
    }
}
var option1 = document.getElementById('option1_checkbox');
option1.addEventListener('click', option1_checker);

function option2_checker(){
    if(document.getElementById('option2_checkbox').checked){
        $('#option1_checkbox').attr('checked', false);
        $('#option3_checkbox').attr('checked', false); 
    }
}
var option2 = document.getElementById('option2_checkbox');
option2.addEventListener('click', option2_checker);

function option3_checker(){
    if(document.getElementById('option3_checkbox').checked){
        $('#option1_checkbox').attr('checked', false);
        $('#option2_checkbox').attr('checked', false); 
    }
}
var option3 = document.getElementById('option3_checkbox');
option3.addEventListener('click', option3_checker);







// controls true false uncheck for tests
function false_checker(){
    if(document.getElementById('false_checkbox').checked){
        $('#true_checkbox').attr('checked', false); 
    }
}
var false_check = document.getElementById('false_checkbox');
false_check.addEventListener('click', false_checker);

function true_checker(){
    if(document.getElementById('true_checkbox').checked){
        $('#false_checkbox').attr('checked', false); 
    }
}
var true_check = document.getElementById('true_checkbox');
true_check.addEventListener('click', true_checker);

Answer 1

根据您的代码，似乎使用单选按钮而不是复选框可以解决您的问题。如果您需要单选按钮看起来像复选框，请查看：Can you style an html radio button to look like a checkbox?

JavaScript订单问题

1 个答案: