Question

我是jquery的新手，我正在寻找一种不引人注目的方法来为javascript“确认”添加jquery替换为HTML元素。具体来说，我希望能够将它用于ASP.NET按钮，LinkButtons，ImageButtons，HyperLink等，客户端意味着以下任何一个：

<input type="submit"... />
<a href="javascript:__doPostBack... />
<input type="image"... />
... etc ...

我提出的解决方案是向ASP.NET服务器控件（以及客户端元素）添加自定义属性，例如：

<asp:ImageButton ... data-confirmPrompt="OK to delete customer 123?" ... />

呈现为：

<input type="image" data-confirmPrompt="OK to delete customer 123?" ... />

然后我只需要为具有此自定义属性的元素添加单击处理程序。以下示例使用jquery-impromptu，但相同的原理适用于任何jquery模式对话框实现：

$(document).ready(function () {
    $("[data-confirmPrompt]").click(function (event) {
        var confirmPrompt = event.currentTarget.attributes['data-confirmPrompt'].value;
        event.preventDefault();
        $.prompt(confirmPrompt, {
            buttons: { Yes: true, No: false },
            callback: function (v, m, f) {
                if (v) {
                    // User clicked Yes.  Unbind handler to avoid
                    // recursion, then click the target element again
                    $(event.currentTarget).unbind('click');
                    event.currentTarget.click();
                }
            }
        });
    });
});

这一切似乎在使用XHTML 1.0 Strict的IE8上运行良好。所以我的问题是：

所有现代浏览器都会接受这样的自定义属性吗？
我知道这不是严格符合标准的。任何人都可以建议一个符合标准的替代方案，至少同样不引人注目且易于使用吗？

更新为自定义属性添加了data-前缀，据我所知至少使其符合HTML5标准。

更新2 有关改进的解决方案，请参阅this follow-up question。

Answer 1

回答1 ：是的，他们会。

回答2 ：您可以添加名为 requires-confirm 的CSS类，并添加data-description或data-meta属性以及您在处理程序中使用的其他文本。

为什么两者？

如果您的页面中集成了多个功能。 CSS类告知应添加哪些功能，data-属性保存要使用的元数据。

如果您只使用一个功能，则可以轻松省略CSS引用，当然只使用data-属性。

Answer 2

使用data-属性，请参阅here

<a href='#' data-confirm="Are you sure?">Some Link</a>

Answer 3

就个人而言，我使用特定的类来做类似的事情。

主要原因是，使用$('.confirm').each()或更好$('.confirm').youConfirmPlugin()之类的内容可以轻松选择它们。而且，css很容易添加到css文件中（它所属的位置）。

如果需要额外数据，则是，使用组合中的数据属性与该类。

将JQuery确认添加到任意元素的最佳不显眼方式

3 个答案:

为什么两者？