将 jquery ui 图标添加到提交按钮答案

【问题标题】：adding jquery ui icon to a submit button将 jquery ui 图标添加到提交按钮
【发布时间】：2013-02-06 16:25:09
【问题描述】：

我的页面的提交按钮有以下代码： html标记是：

<td align="Right"><input type="submit" value="Add Driver" ></td>

jquery 是：

$( "input[type=submit]" ).button().click(function( event ) {
event.preventDefault();
});

如何在上面添加一个 ui 图标，特别是 ui-icon-circle-plus

【问题讨论】：

标签： jquery html jquery-ui button

【解决方案1】：

您可以像这样更改您的 HTML：

<button type="submit">
    Add Driver
</button>

然后像这样更新你的脚本：

$('button[type=submit]').button({icons: {primary: 'ui-icon-circle-plus'}}).click(function (event) {
    event.preventDefault();
});

演示：http://jsfiddle.net/mh5Pu/

【讨论】：

我在小提琴上看不到任何图标。它只是一个文本按钮。

【解决方案2】：

查看http://jqueryui.com/button/#icons 上的示例（特别是图标）。

尝试使用按钮，而不是使用提交输入。

这是带有 ui-icon-circle-plus 的仅图标按钮的修改版本：

<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only"     role="button" aria-disabled="false" title="Button with icon only">
<span class="ui-button-icon-primary ui-icon ui-icon-circle-plus"></span>
<span class="ui-button-text">Button with icon only</span>
</button>

【讨论】：

【解决方案3】：

这应该可以工作

$( "input[type=submit]" ).button({icons: {primary: "ui-icon-circle-plus"}})      .click(function( event ) {
event.preventDefault();
});

或者你之后设置它：

$( "input[type=submit]" ).button( "option", "icons", { primary: "ui-icon-circle-plus", secondary: "<your_second_icon>" } );

Here 是一个工作示例。

【讨论】：

看看这个：jsfiddle.net/Kfubw 你的 HTML 语法也有错误：这是正确的 HTML：