jQuery 和 LinkBut​​tons,或常规按钮和 CSS

Posted

技术标签:

【中文标题】jQuery 和 LinkBut​​tons,或常规按钮和 CSS【英文标题】:jQuery and LinkButtons, or Regular Buttons and CSS 【发布时间】:2011-03-21 21:53:30 【问题描述】:

我的母版页上有一个小的登录控件。在登录控件上,我使用 LinkBut​​ton 作为提交按钮,因为我喜欢它的外观。

但是,我还使用 jQuery 来捕获在任何登录控件文本框中按下“回车”键的时间。在每个浏览器中都很难用 jQuery 触发链接按钮的点击事件。我什至尝试过硬编码 __doPostBack,但 LinkBut​​ton ID 与控件的内置 href="__doPostBack" 属性中的内容略有不同。它没有响应 .trigger()、click() 等。

另一方面,常规的 Button 控件可以很好地使用 jQuery click()。但我不太喜欢按钮的外观,而且我的 CSS 技能有限。有没有一种简单的方法可以将普通的 ASP.NET 按钮控件设置为看起来像一个链接?或者有没有一种简单的方法可以使 LinkBut​​ton 与 jQuery 一起工作?我会选择需要较少努力的任何方法。 :)

提前致谢。

【问题讨论】:

【参考方案1】:

您可以使用ClientScriptManager 获取 LinkBut​​ton 触发的确切 javascript

string postbackFunction = this.Page.ScriptManager.GetPostBackEventReference(myLinkButton, "");

string jQueryBlock = @"$('#loginbox').keypress(function(e)
    if(e.which == 13) " + postbackFunction + ";);

//print the jQueryBlock to the page

它会输出一个看起来像这样的 JS 函数调用:

__doPostBack('linkButtonID','', 0);

【讨论】:

感谢您的回复。我能够通过检索 href 属性并删除 'javascript:' 前缀来获取 javascript。问题是客户端 ID 类似于 ct_100_linkBut​​tonSubmit,而回发脚本是 __doPostBack('ct_100_link%button%submit','')。里面有多余的字符。一旦我将javascript存储在一个变量中,我可以调用它吗?当使用 .click() 事件更容易且更一致时,我不确定是否要解析字符串。 更新:我刚刚解析了字符串并从中获取了 ID。当我使用嵌入在 href 属性中的 ID 时,回发响应很好。再次感谢您的帮助。【参考方案2】:

当然,用 CSS 设置 <input type="submit"><button> 元素的样式不是问题:

input.button,
button    
    margin: 0;
    padding: 0;   

    color: blue;
    background: none;
    border: 0;   

    cursor: pointer;

您可以看到它的外观here。

需要注意的一点是,按钮样式并不总是始终如一地跨浏览器应用。 Here's a post 显示在不同浏览器和操作系统中呈现的差异。换句话说,请确保您的目标浏览器正确应用上述内容。

【讨论】:

以上是关于jQuery 和 LinkBut​​tons,或常规按钮和 CSS的主要内容,如果未能解决你的问题,请参考以下文章

回发前在 Jquery LinkBut​​ton 中验证表单(使用 Html Validate)

为啥 GridView 中的 LinkBut​​ton 不会引发其 OnClick 事件?

UpdatePanel 中 ListView 中的 LinkBut​​ton 导致完全回发

asp.net LinkBut​​ton OnClick 未使用 href 触发

如何让任何 asp:LinkBut​​ton 看起来像一个按钮

ASP.NET 未从 LinkBut​​ton onClick (VB) 获取 CommandArgument 值