Jquery将复选框的原始状态与更改状态进行比较

时间:2015-05-29 14:11:55

标签: jquery checkbox

我想做的是, 我想保持复选框的值(原始状态),然后在复选框状态更改检查状态是否为原始状态,然后显示textarea。

到目前为止我做了什么

<script>
    var status = $('#status').val();
    $(document).ready(function() {
        status = $('#status').is(":checked");
        $('#status').on('click', function() {
           if( $('#status').is(":checked")!=status){
               $('#mandatory').html('*');
           }else{
               alert("else");
               $('#mandatory').html('');
           }
        });
    });
</script>
我面临的问题是它没有比较两个值。

2 个答案:

答案 0 :(得分:0)

$(document).ready(function() {
    var status = $('#status').is(":checked"); // Get default status

    $('#status').on('change', function() {
        // On change the state of checkbox
        var html = ($(this).is(':checked') !== status) ? '*' : '';
        $('#mandatory').html(html).toggle(!!html); // Set the value and toggle(show/hide) the textarea
    });
});

答案 1 :(得分:0)

您可以尝试以下代码:

&#13;
&#13;
$(document).ready(function() {
    var default_status = $('#status_check').is(":checked"); 

    $('#status_check').on('change', function() {
        
        if($(this).is(':checked') == default_status ) {
           // Hide Text box
            $('#field').hide();
        } else {
            // Show text box
             $('#field').show();
        }
        
    });
});
&#13;
<input type="checkbox" class="store_value" id="status_check"><br />
<input type="text" id="field" class="field" style="display:none;" />
&#13;
&#13;
&#13;

JS Fiddle