如何更改链接按钮的颜色并将它们链接到c#中的锚点
本文关键字:链接 按钮 何更改 颜色 | 更新日期: 2023-09-27 18:20:13
我想动态创建链接按钮,并将它们链接到中继器中的锚点。以下是我尝试过的:
int listItemIds = 1;
List<CompanyModel1> companies1 = new List<CompanyModel1>();
for (int ar = 0; ar < arrProcess.Length; ar++)
{
LinkButton lnk = new LinkButton();
lnk.ID = "lnk" + listItemIds;
lnk.Text = arrProcess[ar];
lnk.Attributes.Add("onClick", "return false;"); //This is to prevent the page to reload
lnk.Click += new System.EventHandler(this.colorClick);
lnk.CommandArgument = Convert.ToString(ar); //LinkButton CommandArgument
lnk.CommandName = Convert.ToString(ar); //LinkButton CommanName
lnk.Command += new CommandEventHandler(lb_Command);//
listItemIds++;
PlaceHolder1.Controls.Add(lnk); // Adding the LinkButton in PlaceHolder
和
protected void colorClick(object o, EventArgs e)
{
LinkButton lnk = (LinkButton)o;
lnk.Style["font-weight"] = "bold";
//Process clicked link. for example jump to anchors
}
在我的aspx文件中,我创建了占位符来填充链接按钮:
<div>
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
</div>
我想防止页面重新加载,这样我绑定到中继器的结果仍然存在。但我看不到按钮链接要更改。我想改变它的颜色和字体样式,这样我们就知道它被点击了。我希望它在点击时跳转到锚点。但我不知道如何创建这些锚。你知道吗?非常感谢。
您必须使用OnClientClick事件。以及获取它的服务器。
lnk.Attributes.Add("OnClientClick","window.open('Command.aspx','width=400,Height=400,top=200,left=200'); return false;");
此示例打开一个链接。你可以改变它的颜色。
更新1:要调用没有重载页面,请使用此。
jquery代码:
$.ajax({
type: "POST",
url: "_Default.aspx/GetDate",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
// Do something interesting here.
}
});
asp.net代码:
public partial class _Default : Page
{
[WebMethod]
public static string GetDate()
{
return DateTime.Now.ToString();
}
}
如果从代码中删除以下行,它应该可以工作。
lnk.Attributes.Add("onClick", "return false;");
如果你的页面加载有IsPostBack检查,也需要删除。
工作代码:
protected void Page_Load(object sender, EventArgs e)
{
string[] arrProcess = new[] { "link 1", "link 2", "link 3" };
int listItemIds = 1;
// List<CompanyModel1> companies1 = new List<CompanyModel1>();
for (int ar = 0; ar < arrProcess.Length; ar++)
{
LinkButton lnk = new LinkButton();
lnk.ID = "lnk" + listItemIds;
lnk.Text = arrProcess[ar];
//lnk.Attributes.Add("onClick", "var btn = document.getElementById('"+lnk.ID+"');btn.innerHTML = 'Default Text';btn.innerHTML.style.fontWeight = 'bold';return false;"); //This is to prevent the page to reload
lnk.Click += new System.EventHandler(this.colorClick);
lnk.CommandArgument = Convert.ToString(ar); //LinkButton CommandArgument
lnk.CommandName = Convert.ToString(ar); //LinkButton CommanName
//lnk.Command += new CommandEventHandler(lnk_Command);
listItemIds++;
PlaceHolder1.Controls.Add(lnk); // Adding the LinkButton in PlaceHolder
PlaceHolder1.Controls.Add(new LiteralControl("<br />"));
}
}
protected void colorClick(object o, EventArgs e)
{
LinkButton lnk = (LinkButton)o;
lnk.Style["font-weight"] = "bold";
//Process clicked link. for example jump to anchors
}
更新:
您可以使用如下更新面板停止整页张贴。这仍然会调用页面加载,但会调用其部分回调。
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div>
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
</div>
</ContentTemplate>
</asp:UpdatePanel>
此外,母版页您需要添加一个脚本管理器。
好。我现在得到了你想要的。请执行以下步骤。
我们必须更换你的后端。我使用了超链接而不是链接按钮。
protected void Page_Load(object sender, EventArgs e)
{
string[] arrProcess = new[] { "link 1", "link 2", "link 3" };
int listItemIds = 1;
// List<CompanyModel1> companies1 = new List<CompanyModel1>();
for (int ar = 0; ar < arrProcess.Length; ar++)
{
HyperLink lnk = new HyperLink();
lnk.ID = "lnk" + listItemIds;
lnk.ClientIDMode = ClientIDMode.Static;
lnk.NavigateUrl = "#";
lnk.Text = arrProcess[ar];
lnk.Attributes.Add("onClick", "changeControlStyle('" + lnk.ClientID + "');"); //This is to prevent the page to reload
listItemIds++;
PlaceHolder1.Controls.Add(lnk); // Adding the LinkButton in PlaceHolder
//PlaceHolder1.Controls.Add(new LiteralControl("<br />"));
}
}
然后我在页面中添加了一个javascript方法。将在后面的代码中使用。
<script type="text/javascript">
function changeControlStyle(id) {
document.getElementById(id).style.fontWeight = "bold";
}
</script>
<div>
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
</div>