Question

如果未选中复选框，如何隐藏具有相同名称的输入框

<?php do { ?>
<tr>
<td>    
<input name="id_check[]" type="checkbox" id="id" value="1" />
</td>
<td>    
<input name="tgl[]" type="text" />
</td>
</tr>
<?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>

我尝试使用此

<script>
    $(function () {
        $('input[name="tgl"]').hide();

        //show it when the checkbox is clicked
        $('input[name="checkbox"]').on('click', function () {
            if ($(this).prop('checked')) {
                $('input[name="tgl"]').fadeIn();
            } else {
                $('input[name="tgl"]').hide();
            }
        });
    });
    </script>

但是没有用，谁能帮我

Answer 1

我为你做了一个例子。请注意，我如何在名为 target-id 的复选框上使用自定义属性，该属性将为每个复选框保存目标输入 ID 。

$(document).ready(function()
{
    // Hide all inputs type text at start.

    $("input[type='text']").hide();

    // Assign listeners to checkboxes.

    $("input[type='checkbox']").click(function()
    {
        var targetID = $(this).attr("target-id");

        if ($(this).is(":checked"))
            $("#" + targetID).fadeIn();
        else
            $("#" + targetID).fadeOut();
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table>
<tr>
<td>
    <input name="id_check_1" type="checkbox" target-id="tgl_1" value="1"/>
</td>
<td>
    <input id="tgl_1" type="text"/>
</td>
</tr>
<tr>
<td>
    <input name="id_check_2" type="checkbox" target-id="tgl_2" value="1"/>
</td>
<td>
    <input id="tgl_2" type="text"/>
</td>
</tr>
<tr>
<td>
    <input name="id_check_3" type="checkbox" target-id="tgl_3" value="1"/>
</td>
<td>
    <input id="tgl_3" type="text"/>
</td>
</tr>
</table>

如果复选框为空并且所有输入框都具有相同的名称，如何隐藏输入框

1 个答案: