div видимый false на стороне сервера с использованием класса div в c #

1

У меня есть div на странице aspx, приведенной ниже. У меня есть страница, содержащая код и стиль для рабочего стола и мобильных устройств. Я хочу показать show hide div согласно условию. используя id (более 50 div на странице), это увеличивает код и идентификатор, используя класс, который приведен выше "рабочий стол" и "мобильный", уменьшает код.

<div class="desktop" runat="server">
            <p>this desktop version1</p>
        </div>
        <div class="Mobile" runat="server">
            <p>this mobile version1</p>
        </div>
        <div class="desktop" runat="server">
            <p>this desktop version1</p>
        </div>
        <div class="Mobile" runat="server">
            <p>this mobile version1</p>
        </div>
        <div class="desktop" runat="server">
            <p>this desktop version1</p>
        </div>
        <div class="Mobile" runat="server">
            <p>this mobile version1</p>
        </div>
        <div class="desktop" runat="server">
            <p>this desktop version1</p>
        </div>

Я хочу показать hide div, используя div-класс (не div id) на стороне сервера.

protected void Page_Load(object sender, EventArgs e)
    {

    }

Наконец, я нахожу решение этого, если какой-либо запрос об этом, пожалуйста, ответьте.

 protected void Page_Load(object sender, EventArgs e)
    {
   string theClass;
   theClass = "desktop";
        var theControls = FindByClass(theClass);
        foreach (Control item in theControls)
        {
            //do something;
            if (item is WebControl)
            {
                ((WebControl)item).Visible = false;
            }
            else
            {
               ((HtmlControl)item).Visible = false;
            }
        }

    }

    private IEnumerable FindByClass(string theClass)
    {
        Control[] allControls = FlattenHierachy(Page);


        var theControls = from n in allControls
                          where ((n is WebControl)
                          && ((WebControl)n).CssClass.Contains(theClass))
                          || (n is HtmlControl
                              && ((HtmlControl)n).Attributes.Count > 0
                              && ((HtmlControl)n).Attributes["class"] != null
                              && ((HtmlControl)n).Attributes["class"].IndexOf(theClass) > -1)
                          select n;
        return theControls;
    }

    public static Control[] FlattenHierachy(Control root)
    {
        List<Control> list = new List<Control>();
        list.Add(root);
        if (root.HasControls())
        {
            foreach (Control control in root.Controls)
            {
                list.AddRange(FlattenHierachy(control));
            }
        }
        return list.ToArray();
    }
Теги:

2 ответа

1
Лучший ответ

Как уже упоминалось в комментариях, гораздо лучше использовать медиа-запросы в вашем случае.

Но позвольте просто остаться с вашим вопросом, игнорируя причину. Вы можете найти все элементы управления рекурсивно, а затем скрыть их:

    private IEnumerable<HtmlGenericControl> FindControls(ControlCollection controls, string className)
    {
        foreach (Control control in controls)
        {
            var c = control as HtmlGenericControl;
            if (c != null)
            {
                var classAttribute = c.Attributes["class"];
                if (classAttribute != null)
                    if (classAttribute.Equals(className))
                        yield return c;
            }
            if (control.HasControls())
                foreach (var subControl in FindControls(control.Controls, className))
                    yield return subControl;
        }
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        var a = FindControls(Page.Controls, "Mobile").ToList();
        a.ForEach(p=>p.Visible = false);
    }
0

Вы можете добиться этого, используя jquery. Просто поместите свой код в тег заголовка

<head runat="server">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
function test() {
   if(condition)
   {
        $(".first").hide();
   }
   else
   {
        $(".first").show();
   }
}

</head>

Теперь вы сначала вызываете это на любом событии, например, при нажатии кнопки. Затем Поместите свое условие, чтобы скрыть или показать div внутри блока "if". Это отлично работает для меня.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню