1

以下のコードは、MasterPage の下にあります。たとえば「お問い合わせ」などのタブの 1 つがクリックされたら、 li クラスをアクティブに設定したいと思います。これを行う方法がわかりません。どんな助けでも素晴らしいでしょう。 

<div id="navcontainer">
    <div class="section-wrapper">
        <ul class="links">      
            <li class="">                
                <a href="">Our Company</a>
            </li>       
            <li class="">               
                    <a href="Contact%20Us/Default.aspx">Contact Us</a>
            </li>       
            <li class="">                
                    <a href="">Tab 3</a>
            </li>       
            <li class="">                
                    <a href="">Tab 4</a>
            </li>   
            <li class="">                
                    <a href="">Tab 5</a>
            </li>               
        </ul>
    </div>
</div>
4

3 に答える 3

2

あなたは次のようにjQueryでそれを行うことができます：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 

<script>
$("li").click(function(){
    alert("this is the message");
    if ($("li").hasClass('active')) {
        $("li").removeClass('active');
    }
    $(this).addClass('active');
});
</script>

これがあなたのコードの例です。

于 2012-04-27T19:50:07.910 に答える
1 
        HtmlGenericControl tabContact = Master.FindControl("liContact") as HtmlGenericControl;
        tabContact.Attributes.Add("class", "active");
        Master.FindControl("liContact").Controls.Add(new LiteralControl("<span></span>"));
于 2012-04-30T21:34:07.007 に答える
1

ページにデフォルト値を持つパブリック プロパティを用意し、このプロパティを使用してページに CSS を設定します。

Default.aspx.cs

public partial class Default : System.Web.UI.Page
{
    public string ActiveTab = "contact";

    public void Page_Load(object sender, EventArgs e)
    {

    }
}

デフォルト.aspx

<ul class="links">      
    <li class="">                
        <a href="">Our Company</a>
    </li>       
    <li class="<% if (ActiveTab=="contact") { %>active<% } %>">
            <a href="Contact%20Us/Default.aspx">Contact Us</a>
    </li>       
    <li class="">                
            <a href="">Tab 3</a>
    </li>       
    <li class="">                
            <a href="">Tab 4</a>
    </li>   
    <li class="">                
            <a href="">Tab 5</a>
    </li>               
</ul>

li の css が設定されたら、CSS を使用してアクティブとして視覚的に表現します。

于 2012-04-27T20:22:08.123 に答える