显然,任何事件都不会处理已禁用的<input>
有没有办法解决这个问题?
<input type="text" disabled="disabled" name="test" value="test" />
$(':input').click(function () {
$(this).removeAttr('disabled');
})
在这里,我需要点击输入才能启用它。但如果我不激活它,则不应发布输入。
答案 0 :(得分:240)
禁用的元素不会触发鼠标事件。大多数浏览器会将源自禁用元素的事件传播到DOM树上,因此事件处理程序可以放在容器元素上。但是,Firefox不会出现这种行为,当您单击禁用的元素时,它根本不执行任何操作。
我想不出更好的解决方案,但是,为了完全跨浏览器兼容性,您可以在禁用的输入前放置一个元素并捕获该元素的单击。这是我的意思的一个例子:
<div style="display:inline-block; position:relative;">
<input type="text" disabled />
<div style="position:absolute; left:0; right:0; top:0; bottom:0;"></div>
</div>
JQ:
$("div > div").click(function (evt) {
$(this).hide().prev("input[disabled]").prop("disabled", false).focus();
});
示例:http://jsfiddle.net/RXqAm/170/(已更新为使用jQuery 1.7与prop
而不是attr
)。
答案 1 :(得分:65)
也许您可以将该字段设为只读并在提交时禁用所有只读字段
$(".myform").submit(function(e) {
$("input[readonly]", this).attr("disabled", true);
});
并且输入(+脚本)应为
<input type="text" readonly="readonly" name="test" value="test" />
$('input[readonly]').click(function () {
$(this).removeAttr('readonly');
})
答案 2 :(得分:44)
禁用元素在某些浏览器中“吃掉”点击 - 它们既不响应它们,也不允许它们被元素或任何容器上的任何位置的事件处理程序捕获。
恕我直言,最简单,最干净的“修复”方法(如果你确实需要捕获像OP这样的禁用元素的点击)只是将以下CSS添加到你的页面:
input[disabled] {pointer-events:none}
这将使对已禁用输入的任何点击都会转到父元素,您可以在其中正常捕获它们。 (如果您有多个禁用输入,您可能希望将每个输入放入自己的单个容器中,如果它们尚未按照这种方式布局 - 额外的<span>
或<div>
,比如说 - 只是为了便于区分哪个禁用的输入被点击了。)
缺点是不幸的是,这个技巧不适用于不支持pointer-events
CSS属性的旧浏览器。 (它应该适用于IE 11,FF v3.6,Chrome v4):caniuse.com/#search=pointer-events
如果您需要支持旧浏览器,则需要使用其他答案之一!
答案 3 :(得分:13)
我建议另一种选择 - 使用CSS:
input.disabled {
user-select : none;
-moz-user-select : none;
-webkit-user-select : none;
color: gray;
cursor: pointer;
}
而不是disabled属性。然后,您可以添加自己的CSS属性来模拟已禁用的输入,但需要更多控制。
答案 4 :(得分:7)
$(function() {
$("input:disabled").closest("div").click(function() {
$(this).find("input:disabled").attr("disabled", false).focus();
});
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<div>
<input type="text" disabled />
</div>
&#13;
答案 5 :(得分:4)
或者用jQuery和CSS做这个!
$('input.disabled').attr('ignore','true').css({
'pointer-events':'none',
'color': 'gray'
});
通过这种方式,您可以禁用元素,并且不会触发任何指针事件,但它允许传播,如果提交,您可以使用属性“ignore”忽略它。
答案 6 :(得分:4)
您可以考虑使用change
而不是disabled
。使用一些额外的CSS,您可以设置输入样式,使其看起来像$('form').bind('change', 'input', function () {
console.log('Do your thing.');
});
字段。
实际上还有另一个问题。事件public class StringRev {
public static void main(String[] args) {
// text is containing dummy/ Test string
String text="ReverseToString";
//StringBuilder sb=new StringBuilder();
// In this line I am creating the object of StringBuffer
StringBuffer sb=new StringBuffer();
// using a for loop in decreasing order from length-1 to 0
for(int i=text.length()-1;i>=0;i--){
// getting the character using index and appending in String buffer.
sb.append(text.charAt(i));
}
// converting StringBuffer value to String
System.out.println(sb.toString());
}
}
//output will be "gnirtSoTesreveR"
仅在元素失去焦点时触发,考虑到return redirect('edit_news', url_name_para = request.POST.get('username'))
字段,这不是逻辑。您可能正在通过另一个呼叫将数据推送到此字段中。为了完成这项工作,您可以使用事件&#39; bind&#39;。
return redirect('profs:edit_news', url_name_para = request.POST.get('username'))
答案 7 :(得分:0)
我们今天遇到了这样的问题,但是我们不想更改HTML。因此,我们使用mouseenter事件来实现这一目标
var doThingsOnClick = function() {
// your click function here
};
$(document).on({
'mouseenter': function () {
$(this).removeAttr('disabled').bind('click', doThingsOnClick);
},
'mouseleave': function () {
$(this).unbind('click', doThingsOnClick).attr('disabled', 'disabled');
},
}, 'input.disabled');
答案 8 :(得分:-1)
我找到了另一个解决方案:
index = pd.date_range('1/1/2000', periods=300, freq='15T')
data = {'a': np.random.rand(300), 'b': np.random.rand(300)}
df = pd.DataFrame(data=data, index=index)
df['a'][2:10] = np.nan
In [153]: df.mean(axis=1).resample('24H', how='mean')
Out[153]:
2000-01-01 0.503772
2000-01-02 0.502624
2000-01-03 0.473651
2000-01-04 0.366844
Freq: 24H, dtype: float64
In [154]: df.resample('24H', how='mean').mean(axis=1)
Out[154]:
2000-01-01 0.509912
2000-01-02 0.502624
2000-01-03 0.473651
2000-01-04 0.366844
Freq: 24H, dtype: float64
类“禁用”通过不透明度模仿禁用元素:
<input type="text" class="disabled" name="test" value="test" />
然后取消事件,如果元素被禁用并删除class:
<style type="text/css">
input.disabled {
opacity: 0.5;
}
</style>
答案 9 :(得分:-2)
这里的建议看起来也是这个问题的好候选人
Performing click event on a disabled element? Javascript jQuery
jQuery('input#submit').click(function(e) {
if ( something ) {
return false;
}
});