jquery - 根据选择选项值显示/隐藏复选框

Question

如何根据选择选项值显示/隐藏复选框？我想在选择选项中显示一个基于单个值的复选框，并希望在选择其他值时隐藏它。我正在尝试 jquery 解决方案。

$('#abcselect').change(function(){$('#unknownlicense').toggle($(this).val() == 'first')});

Answer 1

$(document).ready(function() {
    $("select").change(function() {
        $("#foo").toggle($(this).val() == "something"));
    }).change(); // in case the first option is selected on page load
});

试试看：http: //jsfiddle.net/JMGMx/3/

此外，请参阅http://api.jquery.com/toggle/和http://api.jquery.com/slidetoggle/

Answer 2

    $('#YourSelectId').change(function () {
        if($(this).val() == 'TheValueOftheOptionThatHasCheckboxes'){
            $('#IdOfDivContainingTheCheckBoxes').show();
        }
        else{
            $('#IdOfDivContainingTheCheckBoxes').hide();
        }
    });

Answer 3

您可以绑定到使用 jquery 更改的选择选项，代码类似于以下：

$('.target').change(function() { 
    alert('Handler for .change() called.'); 
 });

您可以使用 .show() 和 .hide() 方法显示和隐藏。

你可以结合这些来做类似的事情

$('#SelectId').change(function (){
    if($(this).val() == 'ShowCheckBox'){
         $('DivWithCheckboxes).show()
     }
     else{
         $('DivWithCheckboxes).hide()
     }
});

您可以在以下位置找到有关这些功能的更多信息：

http://api.jquery.com/change/
http://api.jquery.com/show/
http://api.jquery.com/hide/

Answer 4

您始终可以将该复选框（或周围的 div）设置为与选择选项中的值相同的 ID，以便在选择该值时，您只需执行以下操作：

$('#sameIDasOption').show();