JQuery与asp.net结合，区分手机浏览器与PC浏览器显示不同信息

来源：互联网发布：js点击展开隐藏切换编辑：程序博客网时间：2024/05/23 12:14

此代码是为了解决手机浏览器显示Header感觉多余，因为浏览器的标题已经有显示了；而如果PC浏览器不显示Header的话又感觉少了东西，因为PC浏览器的标题没有Header明显，不显示Header不美观。

代码特别简单，所以就不详解了。有疑问我再补充，欢迎大家提问！

asp.net代码

        static public List<String> MobileNames = new List<String> { "iphone", "android", "mobile", "ucweb", "opera mini",                                                                    "samsung", "htc", "lg", "sonyericsson", "nokia", "mot",                                                                    "blackberry", "j2me" };        protected void Page_Load(object sender, EventArgs e)        {            String clientType = HttpContext.Current.Request.UserAgent.ToLower();            Boolean isPCBrowser = true;            foreach (String mobile in MobileNames)            {                if (clientType.Contains(mobile))                {                    isPCBrowser = false;                    break;                }            }            pnlHeader.Visible = isPCBrowser;        }

因为浏览器可以随意设置Request.UserAgent，所以没有绝对计算正确的办法判断浏览器是手机还是PC，此方便已在多种浏览器上测试95%正确。

JQuery代码

<body>    <form id="form1" runat="server">    <div data-role="page" id="page">        <asp:Panel ID="pnlHeader" runat="server">            <div data-role="header" data-theme="b">        <h2>新闻主页</h2>        </div>        </asp:Panel>        <div data-role="content" class="lineHeight2">            <asp:BulletedList ID="listNews" runat="server" DisplayMode="HyperLink">            </asp:BulletedList>        </div>            <div data-role="footer" data-theme="d">    <h4>餐饮咨询</h4>    </div>    </div>    </form></body>

将JQuery的header放入asp.net的Panel中，这样在代码中就可以直接设置panel是否显示了

0 1