Как я могу отключить элемент управления меню от самого стиля в javascript?

Я использую Visual Studio 2010 и ASP.NET 4.0 для отображения элемента управления Menu в виде списка HTML, чтобы я мог стилизовать его с помощью CSS. Вот код, который я использую ниже

<asp:Menu ID="navlist" runat="server" Orientation="Horizontal"
SkipLinkText="" ClientIDMode="Static" DataSourceID="MenuSource" 
MaximumDynamicDisplayLevels="0" IncludeStyleBlock="False" 
StaticDisplayLevels="2">
</asp:Menu>

Это создает следующий HTML

<!-- URL shortened -->
<script src="/WebResource.axd?...t=634066906994188146"type="text/javascript"></script>

<div id="navlist">
    <ul>
        <li><a href="link1.html">Link 1</a></li>
        <li><a href="link2.html">Link 2</a></li>
    </ul>
</div>

На первый взгляд это выглядит именно так, как я хотел. Однако, если я открою WebResource.axd, я обнаружу целую кучу javascript-кода, связанного с меню. Часть этого кода применяет к списку собственные встроенные стили. Используя FireBug, я могу просмотреть разметку HTML после выполнения javascript, и она выглядит примерно так:

<div id="navlist" style="float: left;">
    <ul class="level1 static" tabindex="0" style="position: relative; width: auto; float: left;" role="menubar">
        <li role="menuitem" class="static" style="position: relative; float: left;">
            <a href="link1.html" class="level2 static" tabindex="-1">Link 1</a>
        </li><li role="menuitem" class="static" style="position: relative; float: left;">
            <a href="link2.html" class="level2 static" tabindex="-1">Link 2</a></li>
    </ul>
</div>

Эти встроенные стили в конечном итоге влияют на макет моей страницы. Мне не нужны никакие сценарии в WebResource.axd. Как я могу предотвратить отображение этого скрипта в окончательной разметке страницы?


asp.net .net-4.0 webresource.axd aspmenu-control
person Cory    schedule 19.06.2010    source источник

Ответы (6)


arrow_upward
2
arrow_downward

Вы не можете сильно изменить стандартную функциональность элемента управления Menu. Однако вы можете либо создать свой собственный элемент управления, либо использовать Инструментарий адаптера управления CSS.

person David Neale    schedule 19.06.2010
comment
Спасибо, Дэвид, я попробую пойти в другом направлении. - person Cory; 21.06.2010

arrow_upward
8
arrow_downward

Вы можете указать меню НЕ стилизовать себя, если хотите просто использовать атрибут IncludeStyleBlock.

По умолчанию включено "true"

<asp:Menu IncludeStyleBlock="False" />
person Jacqueline Loriault    schedule 14.09.2013

arrow_upward
5
arrow_downward

В вашем css используйте !important

person Ola    schedule 15.11.2011
comment
Это действительно так просто, большое спасибо за подсказку! Я боролся с той же проблемой в течение всего дня. - person Denys Avilov; 01.04.2016

arrow_upward
3
arrow_downward

Я создал пользовательское меню (производное от System.Web.UI.WebControls.Menu) и заменил OnPreRender:

public class MyCustomMenu : System.Web.UI.WebControls.Menu
{
    protected override void OnPreRender(EventArgs e)
    {
        // Don't call base OnPreRender
        //base.OnPreRender(e);
    }
}

Это помогло.

person ajcs    schedule 20.10.2011

arrow_upward
0
arrow_downward

Мне удалось это, удалив встроенные стили и изменив имена некоторых классов с помощью jQuery. Конечно, вы можете изменить стиль каждого элемента, но это просто создаст много ненужного CSS-кода.

Используйте это, если вы хотите удалить эти встроенные стили из li, a, ul и div:

$("#navlist li,#navlist li a,#navlist ul,#navlist div").removeAttr('style');

Во-вторых, вы можете изменить эти имена классов, например:

$("#from-this-element").removeClass(.remove-me).addClass('.new-class');

И я думаю, что это лучший способ использовать этот скрипт после загрузки страницы.

person Arthustiak    schedule 02.09.2014

arrow_upward
0
arrow_downward

Я пытался переопределить asp:menu с помощью пользовательского класса, но до сих пор не научился просто удалять все атрибуты из тегов ul, li и a, чтобы я мог применить свой собственный код CSS к чистому списку.

Imports Microsoft.VisualBasic
Namespace MCO

Public Class MyCustomMenu
    Inherits Menu

        Protected Overrides Sub OnPreRender(e As EventArgs)
            ' don't use this:
            ' MyBase.OnPreRender(e)

            ' but leaving this blank produces NO rendered menu
        End Sub
    End Class
End Namespace

Я также пробовал метод jQuery:

$("#navlist li,#navlist li a,#navlist ul,#navlist div").removeAttr('style');

Но поскольку веб-ресурс .net запускался последним, я обнаружил, что строка jQuery не работает. Он должен, но не работает. :(

person Community    schedule 05.05.2015
comment
Попробуйте не использовать элемент управления Menu, а вместо этого используйте простой виджет меню jQuery. - person John Saunders; 05.05.2015
comment
Я разработал другие альтернативы, когда все, что мне нужно сделать, это отобразить меню без какой-либо фильтрации. Бывают случаи, когда я должен использовать элемент управления asp:menu, потому что он выполняет обрезку безопасности по роли Active Directory. Я безуспешно пытался использовать jQuery для скрытия ссылок по совпадению ролей (или несоответствию). - person ; 08.05.2015