jQuery 对话框中的图像按钮答案

【问题标题】：Image button in jQuery dialogjQuery 对话框中的图像按钮
【发布时间】：2016-09-02 21:12:29
【问题描述】：

我想创建一个带有图像按钮的 JQuery 对话框。我尝试用我的图像替换按钮，但它没有按预期工作。我还尝试将我的图像 src 添加到按钮上，也没有运气。所以我想知道是否可以在 JQuery 对话框中创建图像按钮？

【问题讨论】：

请出示代码以便我们为您提供帮助
设置按钮的样式，使其没有边框，并使用您的图像作为背景
$dialogContent.dialog({ button: { save: function () { }}}).show();这将创建按钮。我想要我的图片而不是保存按钮。

【解决方案1】：

我假设您已经能够通过常规按钮而不是在对话框中获得所需的内容。

您不必使用buttons 选项将按钮放在对话框中。您可以以正常方式执行此操作：

<div id="dialogWithButtons">
    <button id="saveButton">Save</button>
    <button id="cancelButton">Cancel</button>
</div>

然后在你的脚本中：

$('#dialogWithButtons').dialog();
$('#saveButton').on('click', function(e, ui) {
     //do whatever
});

等等。我会让您根据您的具体情况制定详细信息。

不过，有一件事：您需要确保您的 jQuery 选择器唯一地引用您的按钮。这在我的情况下出现了取消按钮，因为我有一个 .cancelButton 类，用于多个页面的单击事件处理程序（因为每页只有一个）。如果您这样做，单击取消按钮将运行（或至少在我的情况下，运行）处理程序，就像您单击主页上的取消按钮一样。

【讨论】：