Jquery

Question

您好，我有以下表格：

               {{ Form::open(array('url' => 'profile', 'class' => 'form-horizontal')) }}
                        <div class="checkbox-custom fill checkbox-success mb5">
                            <fieldset class="arma2-mysql-question">
                                {{ Form::checkbox('arma2-mysql', '', $user->arma2_mysql, ['id' => 'arma2-mysql', 'onChange' => 'valueChanged()']) }}
                                {{ Form::label('arma2-mysql', 'Arma2 MySQL') }}
                            </fieldset>
                        </div>
                        <fieldset class="arma2-mysql-answer">
                            {{ Form::label('databaseip', 'Database IP') }}
                            {{ Form::text('databaseip', $user->arma2_mysql_ip, array('class' => 'form-control')) }}
                            {{ Form::label('database', 'Database') }}
                            {{ Form::text('database', $user->arma2_mysql_database, array('class' => 'form-control')) }}
                            {{ Form::label('databaseusername', 'Database Username') }}
                            {{ Form::text('databaseusername', $user->arma2_mysql_username, array('class' => 'form-control')) }}
                            {{ Form::label('databasepassword', 'Database Password') }}
                            {{ Form::password('databasepassword', array('class' => 'form-control')) }}
                        </fieldset>
                {{ Form::close() }}

和以下脚本：

function valueChanged() {
if ($('.arma2-mysql').is(':checked')) {
    $(".arma2-mysql-answer").hide();
} else {
    $(".arma2-mysql-answer").show();
} 
}

这在取消选中时工作正常，但再次选中时却不显示表单？

有什么想法吗？

Answer 1

尝试使用切换：

$('.arma2-mysql').change(function(){
$('.arma2-mysql-answer').toggle(!this.checked);
});

Answer 2

这是一个 class 选择器：

$('.arma2-mysql')

它看起来应该是一个基于您的 ID 选择器 html:

$('#arma2-mysql')

您也可以考虑使用 Jquery toggle 对 show/hide 的调用，这样您就可以完全省去 if 语句。

Answer 3

已修复，

问题是我在搜索 class .arma2-mysql 时我的元素从来没有这个 class，而是有一个 ID #arma2-mysql

Answer 4

像这样的？ http://jsfiddle.net/swm53ran/100/

$(document).ready(function() {
    $('.checkbox').on('change', function() {
        $('.shownDiv').toggle();
    });
});

<input class="checkbox" type="checkbox" /> Show div
<br/><br/>
<div class="shownDiv" style="display:none;">Shown when checked</div>

Jquery - hide/show 基于复选框值

Jquery - hide/show based on checkbox value

laravel