ASP.Net母版页和jQuery创建重复的内容 [英] ASP.Net Masterpage and jQuery creates duplicate content

问题描述

我有一个带有jQuery标签的ASP.Net母版页.

I have a ASP.Net masterpage with jQuery tabs.

我正在尝试像这样设置它:

I am trying to set it up like this:

<div id="tabs">
    <ul>
        <li><a href="Default.aspx">Home</a></li>
        <li><a href="Settings.aspx"">Settings</a></li>
        <li><a href="About.aspx">About</a></li>
    </ul>
    <div>
        <asp:ContentPlaceHolder ID="Content" runat="server">
        </asp:ContentPlaceHolder>
    </div>
</div>

contentplaceholder的div位于选项卡div中，以使jQuery选项卡围绕内容.不幸的是，当将jQuery变成真正的jQuery标签时，jQuery复制了母版页的所有内容:

The contentplaceholder's div is inside the tab div to make the jQuery tabs surround the content. Unfortunately, jQuery duplicates all the content of the master page when turning this into real jQuery tabs:

<script>
    $(document).ready(function () {
        $("#tabs").tabs();
    });
</script>

如何避免这种情况?

推荐答案

您的问题是，"jQuery"选项卡更改了其内容已加载到页面中的三个div的可见性. 使用时没有不同的页面.

your problem is that JQuery tabs changes the visibillity of three divs whose content is loaded in the page. Not different pages as you use.

因此，如果需要的话，可以利用JQuery ui CSS的选项卡.

So if what you want, is to take advantage of JQuery ui CSS for your tabs.

然后，执行此操作的简单方法是将类名复制到li-tag中，并进行一些服务器端逻辑操作，以更改活动/非活动选项卡的类. 我自己做了一个MVC解决方案，我想让布局保持一致，因此选择了JQuery UI.

Then the simple way of doing it is to copy the classnames into the li-tags and make some server side logic to change the class for active / inactive tabs. i have done this myself for a MVC solution where I wanted the layout to be consistent and therefore chose JQuery UI.

以下情况:

    <li><a href="Default.aspx" class="ui-tabs... ui-... <%
    if(HttpContext.current.url.contains("Default.aspx"))%><%:ui-active-tab%><%
    %>" >Home</a></li>
    <li><a href="Settings.aspx" class="ui-tabs... ui-... <%
    if(HttpContext.current.url.contains("Settings.aspx"))%><%:ui-active-tab%><%
    %>" >Settings</a></li>

语法是从内存中写入的，包括C#和类名.因此，请原谅我在这方面的错误.

the syntax is written from memory, both C# and class names. So please forgive me for errors in this respect.

希望我猜对了.

这篇关于ASP.Net母版页和jQuery创建重复的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！