使用 C# 通过 attributes.add 创建多个 HTML 属性的语法
本文关键字:HTML 属性 语法 创建 通过 attributes add 使用 | 更新日期: 2023-09-27 18:35:06
这是冗长的,但对于你们中一个知识渊博的小伙子来说应该很容易锻炼。
我有一个带有动态登录链接的DotNetNuke网页。 如果您未登录,链接将是"登录",并具有指向登录弹出窗口的相应 URL。 如果您已登录,则链接将是"注销",并且同样具有处理注销的网页的相应URL。
当页面确定您是否登录时,HTML 链接将使用以下属性构建:onclick="return dnnModal.show('http://blahblah.com....')。
执行此操作的代码:
loginLink.Attributes.Add(" onclick", "return " + UrlUtils.PopUpUrl(loginLink.NavigateUrl, this, PortalSettings, true, false, 200, 550));
无论链接是什么,ID 和类始终保持不变。 我的问题是我想用图像替换登录文本,实际上是用于登录和注销的不同图像。 这里的问题是,由于 ID 和类保持不变,我不能像往常一样通过 CSS 来做到这一点,但我已经能够根据它们的属性设置类的样式。 我已经通过找出创建 HTML 链接的输出并根据"href"属性设置类样式来对此进行测试,例如:
a #dnn_dnnLogin_loginLink .LoginLink [href="http://some very very long dynamically created URL.aspx"]{ styles here }
这样做的问题是登录/注销链接会根据您当前所在的页面而变化。
我确实知道两个渲染选项中的每一个都有一个我可以设置样式的 uniqe 属性,这就是它们的"文本"属性。 所以很简单,我如何添加此属性以在 HTML 中呈现,以便我可以使用 CSS 设置它的样式?
我尝试了几种变体,例如:
loginLink.Attributes.Add(" onclick", "return " + UrlUtils.PopUpUrl(loginLink.NavigateUrl, this, PortalSettings, true, false, 200, 550) " Text", + loginLink.Text);
希望渲染的内容是这样的:
onclick="return dnnModal.show('http://localhost/CPD/tabid/87/ctl/Login/Default.aspx?returnurl=%2fCPD.aspx&popUp=true',/*showReturn*/true,200,550,true,'')" Text="Login"
所以我可以风格:
a #dnn_dnnLogin_loginLink .LoginLink [Text="Login"]{styles here}
a #dnn_dnnLogin_loginLink .LoginLink [Text="Logout"]{styles here}
但相反,我得到了一个通用错误。 我尝试了各种写行的方法都没有成功,我只是不知道语法。
有人可以指出我正确的方向吗? 我希望我没有吠错树,因为这将是我最初问题的一个非常简单的解决方案。
谢谢
编辑 - 整个页面的代码,如果有帮助?
using System;
using System.Web;
using System.Web.UI;
using DotNetNuke.Common;
using DotNetNuke.Common.Utilities;
using DotNetNuke.Services.Exceptions;
using DotNetNuke.Services.Localization;
using DotNetNuke.UI.Modules;
namespace DotNetNuke.UI.Skins.Controls
{
public partial class Login : SkinObjectBase
{
private const string MyFileName = "Login.ascx";
public string Text { get; set; }
public string CssClass { get; set; }
public string LogoffText { get; set; }
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
try
{
if (!String.IsNullOrEmpty(CssClass))
{
loginLink.CssClass = CssClass;
}
if (Request.IsAuthenticated)
{
if (!String.IsNullOrEmpty(LogoffText))
{
if (LogoffText.IndexOf("src=") != -1)
{
LogoffText = LogoffText.Replace("src='"", "src='"" + PortalSettings.ActiveTab.SkinPath);
}
loginLink.Text = LogoffText;
}
else
{
loginLink.Text = Localization.GetString("Logout", Localization.GetResourceFile(this, MyFileName));
}
loginLink.NavigateUrl = Globals.NavigateURL(PortalSettings.ActiveTab.TabID, "Logoff");
}
else
{
if (!String.IsNullOrEmpty(Text))
{
if (Text.IndexOf("src=") != -1)
{
Text = Text.Replace("src='"", "src='"" + PortalSettings.ActiveTab.SkinPath);
}
loginLink.Text = Text;
}
else
{
loginLink.Text = Localization.GetString("Login", Localization.GetResourceFile(this, MyFileName));
}
string returnUrl = HttpContext.Current.Request.RawUrl;
if (returnUrl.IndexOf("?returnurl=") != -1)
{
returnUrl = returnUrl.Substring(0, returnUrl.IndexOf("?returnurl="));
}
returnUrl = HttpUtility.UrlEncode(returnUrl);
loginLink.NavigateUrl = Globals.LoginURL(returnUrl, (Request.QueryString["override"] != null));
if (PortalSettings.EnablePopUps && PortalSettings.LoginTabId == Null.NullInteger)
{
loginLink.Attributes.Add(" onclick", "return " + UrlUtils.PopUpUrl(loginLink.NavigateUrl, this, PortalSettings, true, false, 200, 550));
}
}
}
catch (Exception exc)
{
Exceptions.ProcessModuleLoadException(this, exc);
}
}
}
}
类就是为此目的而设计的,所有使用 CSS 样式的浏览器(甚至是非常旧的浏览器)都支持它们。您不必与晦涩的选择器争吵,这些选择器引用了一些链接,这些链接可能会再次更改并破坏您的样式。
既然你说你已经为这些标签分配了一个类,你只需要指定一个额外的类。您可以将多个类断言到一个标记。有关详细信息,请参阅 W3C css 类页面,在"属性值"部分中:
指定元素的一个或多个类名。指定多个 类,用空格分隔类名,例如 .这允许您将多个 CSS 类组合为一个 元素。
您可以简单地通过将第二个类附加到WebControl.CssClass
字符串(用空格分隔)来设置第二个类:
loginLink.CssClass = loginLink.CssClass + " login";
或
loginLink.CssClass = loginLink.CssClass + " logout";
这样,您可以通过CSS样式表中的单个类选择器甚至多类选择器(仅选择分配了两个类的标记)来访问它:
.LoginLink.login { /* styles here */ }
.LoginLink.logout { /* styles here */ }
登录/注销按钮上的文本不存储在 Text=" 属性中,而是存储在 InnerHTML 节点中。所以你的CSS选择器将不适用。(我也认为选择器中的间距是错误的,并且此解决方案不支持多语言按钮等)
通常,这种类型的样式将在皮肤编辑器(管理员/皮肤/向下滚动到皮肤设计器部分)中实现,在其中选择皮肤或容器、文件、令牌=登录、设置=文本和注销文本,并添加一个值 src=path/to/a.gif。但是,皮肤设计器似乎在6.1.x中被破坏了(错误报告)
您仍然可以尝试查看 DNN 安装的 admin''Skins 目录中的 login.ascx 和 login.ascx.cs 文件。编辑代码以根据 Request.IsAuthenticated(根据 Request.IsAuthenticated)分配 loginLink.ImageUrl。