jQuery在asp.net web表单中隐藏的html服务器控件复选框

html server control Check box hiding by jQuery in asp.net web form

本文关键字：隐藏 html 服务器控件复选框表单 asp net web jQuery 更新时间：2023-09-26

我有一个简单的页面，有三个复选框，通过jQuery自动填充数据，第四个没有数据(空)。

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="MasterPageWithHTMLInput.aspx.cs" Inherits="Test_WSMS_TV.MasterPageWithHTMLInput" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            // alert('akash');
            $(document).ready(function() {
                var arr = ["val1", "val2", "val3"];
                $('#check label').each(function(index) {
                    if (index < arr.length)
                        $(this).text(arr[index]);    
                });    
            });
        </script>
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
        <div class="container" id="check">
            <input type="checkbox" id="CheckBox3" runat="server" />
            <label>
            </label>
            <input type="checkbox" id="CheckBox4" runat="server" />
            <label>
            </label>
            <input type="checkbox" id="CheckBox5" runat="server" />
            <label>
            </label>
            <input type="checkbox" id="CheckBox6" runat="server" />
            <label>
            </label>
        </div>
    </asp:Content>

我想用jQuery隐藏没有数据的复选框和标签(第四个)。

<input type="checkbox" id="CheckBox6" runat="server"/>
        <label>
        </label>

我如何通过jQuery做到这一点?

不妨试试下面这些

$("#CheckBox6").hide();

或

$("#CheckBox6").toggle();

您可以使用:empty选择器

选择所有没有子元素的元素(包括文本节点)。

脚本

$('#check label:empty').hide();
$('#check label:empty').prev(':checkbox').hide();

我找到了一个动态的解决方案。填充ID并隐藏空文本框

的其余部分

<script type="text/javascript">
       // alert('akash');
        $(document).ready(function () {
            var arr = ["val1", "val2", "val3"];
            $('#check label').each(function (index) {
                if (index < arr.length)
                    $(this).text(arr[index]);
                else {
                    //                    $('#check label:empty').prev(':checkbox').hide();
                    var i = index + 3;
                    var id = "#CheckBox" + i;
                    alert(id);
                    $(id).hide();
                }
            });
         //   $("#CheckBox6").hide();
        });
    </script>

and in main place holder clientdmode ="Static"在asp.net中是必需的。

<input type="checkbox" id="CheckBox6" runat="server" clientidmode="Static" />
        <label>
        </label>