2

浏览互联网以查找如何禁用按钮：

<td valign="center" halign="left"><a href="#" id="save-user" data-role="button" data-inline="true" data-theme="b" data-icon="check">Save</a></td>

大多数食谱都没有结果：

$('#operator-modify').ready( function () {
// None of the below disable button
//$("#save-user").attr("disabled", true).button("refresh");
//$('#save-user').addClass('ui-state-disabled').attr('disabled', true);
//$('#save-user').attr('disabled', 'disabled').addClass( 'ui-state-disabled');
});

最后 - 如何启用/禁用按钮？

4

5 回答 5

4

当您使用链接标签作为按钮（即添加data-role="button"）时，JQM buttonMarkup 插件会应用按钮小部件标记/样式，但实际上并不会创建按钮小部件。由于您实际上没有按钮小部件，因此您不能使用按钮小部件方法（启用、禁用等），而是禁用或启用您的“按钮”，您需要添加/删除ui-disabled该类。

$('#save-user').addClass("ui-disabled");

这是一个简单的jsBin

附带说明一下，如果您不使用按钮进行导航，您可能想要使用表单按钮 ( input, button)，如果您确实使用常规按钮，那么您可以改用 JQM 按钮禁用方法。

于 2013-04-18T15:36:11.050 回答
2

jQuery mobile 有几种类型的按钮。“基础”页面中的第一个是<a data-role="button">. 这种类型的按钮可以通过应用.ui-disabled类来禁用：

$('#operator-modify').ready( function () {
   $('#save-user').addClass('ui-disabled');
});

文档中有关于样式为按钮的链接的注释。

注意：按钮样式的链接具有与下面真正的基于表单的按钮相同的视觉选项，但有一些重要的区别。基于链接的按钮不是button插件的一部分，仅使用底层buttonMarkup插件来生成按钮样式，因此不支持表单按钮方法（启用、禁用、刷新）。如果您需要禁用基于链接的按钮（或任何元素），可以使用 JavaScript 自己应用禁用的类 ui-disabled 来实现相同的效果。

其他类型的按钮是<input type="button">和<button>。这种类型的按钮可以通过调用“按钮”小部件的“禁用”方法来禁用。

$('#operator-modify').ready( function () {
   $('#save-user').button('disable');
});

完整示例：http: //jsfiddle.net/xH7W3/3/

于 2013-04-18T15:05:19.677 回答
0

你所拥有的不是一个按钮。这是一个 html 锚标记。这就是按钮相关的禁用功能对您不起作用的原因。

如果您可以将<a>标签更改为<button>标签，<input type="button" />那么以下应该可以工作。 $("#save-user").attr("disabled", true);

如果您不能将其更改为按钮，则可以添加样式类以使超链接看起来被禁用（灰色和鼠标光标正常而不是指针），并防止默认单击。

于 2013-04-18T14:57:12.357 回答
0

您不是要禁用按钮，而是要禁用锚<a>标记。

当它不应该去任何地方/做任何事情时，要么转换为使用<button>，要么使用.click()返回。false

您可能还需要在“禁用”时为您的锚定义另一种样式

我建议使用<button>，虽然...

于 2013-04-18T14:56:57.683 回答
-1

您正在使用锚 <a> 元素。它没有禁用之类的属性。要禁用锚元素，您可以执行以下操作：

$("#save-user").click(function(e) { 
    e.preventDefault(); 
});

preventDefault 确保任何 HTML / 浏览器反应都将被取消。

如果您只想禁用一个按钮，它可以是输入 <input> 元素或 <button> 元素，您可以简单地执行以下操作：

<input type="button" value="Click Me" disabled/>
于 2013-04-18T15:00:35.743 回答