2
<table class='generic'>
<script>
$('#select_bh').click(
    function(){
        if($('#select_bh')[0].checked){
        $('#hide_box_bh_s').show();
        }
        else{
        $('#hide_box_bh_s').hide();
        }
    }
);
</script>
<tr>
    <td>
        <b><input type="checkbox" id="select_bh" name="pj_boilerhouse" value="Boiler_House"/>Boiler House</b>
    </td>
</tr>
<tr>
    <td>
        <span id='hide_box_bh_s' style='display:none'>
            &nbsp;&nbsp;<b><input type="checkbox" class="case_bh_s" name="pj_bh_s" value="Structural"/> Structural</b>
        </span>
    </td>
</tr>
</table>

JavaScript の show show/hide が機能していません。アドバイスをお願いします。thx..チェックボックスをオンにすると、既存の行の下に新しい行が表示されます。

4

2 に答える 2

1

コードはドキュメント対応ハンドラー内に配置する必要があります。まだ DOM に追加されていない要素にイベント ハンドラーをバインドしているため、コードは機能しません。Ready ハンドラー内のコードは、DOM が完全にロードされた後に実行されます。また、 JavaはJavaScriptではないことに注意してください。

$(document).ready(function(){
   $('#select_bh').click(function(){
        $('#hide_box_bh_s').css('display', this.checked ? 'block' : 'none');
   });
})

ステートメントのショートカットである条件演算子を使用しました。ifチェックボックスをオンにすると、displayプロパティの値が に設定されblock、それ以外の場合は に設定されnoneます。

于 2012-09-04T02:00:51.640 に答える
1

ここでの作業は、コードhttp://jsfiddle.net/damian_silvera/9ym5Y/を見ることができます

于 2012-09-04T02:14:11.653 に答える