有时我使用样式为按钮的锚,有时我只使用按钮。我想禁用特定的点击东西,以便:
他们看起来很残疾 它们不再被点击
我该怎么做呢?
有时我使用样式为按钮的锚,有时我只使用按钮。我想禁用特定的点击东西,以便:
他们看起来很残疾 它们不再被点击
我该怎么做呢?
当前回答
下面这些方法对我来说非常有效:
$("#button").attr('disabled', 'disabled');
其他回答
假设你在页面上有这样的按钮:
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit"value="Enable All" onclick="change()"/>
js代码:
function change(){
var toenable = document.querySelectorAll(".byBtn");
for (var k in toenable){
toenable[k].removeAttribute("disabled");
}
}
注意,如果你使用Bootstrap的JS按钮和“loading”状态,会有一个奇怪的问题。我不知道为什么会发生这种情况,但这里有如何解决它。
假设你有一个按钮,并将其设置为加载状态:
var myButton = $('#myBootstrapButton');
myButton.button('loading');
现在你想把它从加载状态中拿出来,但也要禁用它(例如,按钮是一个保存按钮,加载状态表明正在进行验证,验证失败)。这看起来像合理的Bootstrap JS:
myButton.button('reset').prop('disabled', true); // DOES NOT WORK
不幸的是,这将重置按钮,但不会禁用它。显然,button()执行一些延迟的任务。所以你也必须推迟你的残疾:
myButton.button('reset');
setTimeout(function() { myButton.prop('disabled', true); }, 0);
有点烦人,但这是我经常使用的模式。
假设你有文本框和提交按钮,
<input type="text" id="text-field" />
<input type="submit" class="btn" value="Submit"/>
禁用:
要禁用任何按钮,例如,提交按钮,你只需要添加disabled属性为,
$('input[type="submit"]').attr('disabled','disabled');
执行上述代码行后,你的提交按钮html标签看起来是这样的:
<input type="submit" class="btn" value="Submit" disabled/>
注意添加了'disabled'属性。
启用:
用于启用按钮,例如当文本字段中有一些文本时。您将需要删除启用按钮的禁用属性,
if ($('#text-field').val() != '') {
$('input[type="submit"]').removeAttr('disabled');
}
现在上面的代码将删除'disabled'属性。
我知道我来晚了,但我要具体回答两个问题:
“我只是想禁用特定的点击内容,以便:
它们停止点击 他们看起来很残疾
这能有多难?”
它们停止点击
1。对于<button>或<input type="button">这样的按钮,您可以添加属性:disabled。
<button type="submit" disabled>Register</button>
<input type="button" value="Register" disabled>
2。对于链接,任何链接…实际上,任何HTML元素,你都可以使用CSS3指针事件。
.selector { pointer-events:none; }
浏览器对指针事件的支持在今天的技术水平上是非常棒的(5/12/14)。但是我们通常必须支持IE领域的传统浏览器,所以IE10及以下不支持指针事件:http://caniuse.com/pointer-events。因此,使用其他人在这里提到的JavaScript解决方案之一可能是传统浏览器的出路。
有关指针事件的更多信息:
https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events http://wiki.csswg.org/spec/css4-ui#pointer-events
他们看起来很残疾
显然这是一个CSS的答案,所以:
1。对于<button>或<input type="button">这样的按钮,使用[attribute]选择器:
button[disabled] { ... }
input[type=button][disabled] { ... }
--
下面是我在这里提到的东西的一个基本演示:http://jsfiddle.net/bXm5B/4/
希望这能有所帮助。
如果你想禁用可点击,你也可以在html中添加内联这个
style="cursor: not-allowed;"