Question

我在html页面中有按钮点击事件，我正在调用PHP文件。在php里面我有两个div，我想根据我的复选框显示隐藏... 现在它显示了两个复选框和show div。但我想加载show div只有当用户检查第一个复选框我怎么能实现这一点？请帮助。其中PHP代码

<div id="dialog_title">
  <input type="checkbox" name="First" value="First">
    First List<br>
      <input type="checkbox" name="Second" value="Second">Second
</div>

    <div id="Show div">

        <table>
            <tr>
                <th> Name </th>
                <th> Address </th>
            </tr>
            <?php
            foreach ( $deviceArr as $device) {
                $id = $device['id'];
                $name = $device ['name'];
                $Address = $device['address'];
                ?>
                <tr class="font1">
                    <td> <input type="text" class="g_input_text" name="name[]" value="<?php echo $name; ?>" /> </td>
                    <td> 
                        <input type="text" class="g_input_text" name="address[]" value="<?php echo $Address; ?>" /> 
                        <input type="hidden" name="id[]" value="<?php echo $id; ?>" />  
                    </td>
                </tr>
                <?php
            }
            ?>


        </table>

    </div>

Answer 1

加载页面后，隐藏名为show div的{{1}}我，并将first_list_bx的ID设置为第一个复选框，如：

first_chk_bx

然后使用jquery检测复选框的签入并显示<input type="checkbox" name="First" value="First" id="first_chk_bx"> <div id="first_list_bx" style="display:none;"> //code </div>，如：

first_list_bx

Answer 2

这是你期待的吗？

$(document).ready(function() {
    $('#Show').hide();
    $("input[name=First]").click(function () {
        $('#Show').toggle();
    });
 });

在JQuery完成。查找 Demo

注意：将<div id="Show div">更改为<div id="Show">

Answer 3

当您使用javascript标记问题时，请在您的html中尝试使用此js函数

<强> HTML

<div id="dialog_title">
  <input type="checkbox" name="First" value="First" onclick="javascript:show_hide(this, 'Show_div')">
    First List<br>
      <input type="checkbox" name="Second" value="Second">Second
</div>

    <div id="Show_div" style="display:none">

        <table>
            <tr>
                <th> Name </th>
                <th> Address </th>
            </tr>

                 <?php
        foreach ( $deviceArr as $device) {
            $id = $device['id'];
            $name = $device ['name'];
            $Address = $device['address'];
            ?>
            <tr class="font1">
                <td> <input type="text" class="g_input_text" name="name[]" value="<?php echo $name; ?>" /> </td>
                <td> 
                    <input type="text" class="g_input_text" name="address[]" value="<?php echo $Address; ?>" /> 
                    <input type="hidden" name="id[]" value="<?php echo $id; ?>" />  
                </td>
            </tr>
            <?php
        }
        ?>




        </table>

    </div>

<强> JAVASCRIPT

<script>
        function show_hide(my_obj, id)
        {
            var chk = my_obj.checked;
            if(chk===true)
            {   
                document.getElementById(id).style.display="block";
            }
            else
            {
                document.getElementById(id).style.display="none";
            }
        }
    </script>

div隐藏并在复选框中显示PHP内部

3 个答案: