我正在使用一个<input readonly="readonly">
,将其样式设置为普通文本以消除交互字段的外观,但仍然显示值。
这非常有用,可以防止用户编辑字段,同时仍然能够发送值。 我意识到这是一种方便的方法,并且有几个解决方法,但我想使用这种方法。
问题:当单击/聚焦字段时,闪烁的插入符号仍然会出现。(至少在Win7上的FF和IE8中)
理想情况下,我希望它像平常一样具有可聚焦性,但不会出现闪烁的插入符号。
欢迎使用Javascript解决方案。
我正在使用一个<input readonly="readonly">
,将其样式设置为普通文本以消除交互字段的外观,但仍然显示值。
这非常有用,可以防止用户编辑字段,同时仍然能够发送值。 我意识到这是一种方便的方法,并且有几个解决方法,但我想使用这种方法。
问题:当单击/聚焦字段时,闪烁的插入符号仍然会出现。(至少在Win7上的FF和IE8中)
理想情况下,我希望它像平常一样具有可聚焦性,但不会出现闪烁的插入符号。
欢迎使用Javascript解决方案。
在我的设备上没有插入符号或类似的东西:
<input type="text" value="test" readonly="readonly" >
看一下这个:http://www.cs.tut.fi/~jkorpela/forms/readonly.html
抱歉,我现在理解了你的问题。
试试这个:
<input type="text" value="test" onfocus="this.blur()" readonly="readonly" >
<input id="someID" onfocus="this.blur()" readonly="readonly" />
- 其实正确的 HTML 是 readonly="readonly"
:) - Timonfocus="this.attributes.readonly && this.blur()"
的检查来仅在当前为只读时模糊聚焦。 - swornabsent你可以在CSS中使用它,但它不会聚焦:
[readonly='readonly'] {
pointer-events: none;
}
onclick
事件的发生。 - Rockallite<input type="text" onfocus="this.blur()" readonly >
$(document).on('focus', 'input[readonly]', function () {
this.blur();
});
我发现唯一的方法是
//FIREFOX
$('INPUT_SELECTOR').focus(function () {
$(this).blur();
});
//INTERNET EXPLORER
$('INPUT_SELECTOR').attr('unselectable', 'on');
KENDO
$('.k-ff .k-combobox>span>.k-input').focus(function () {
$(this).blur();
});
$('.k-ie .k-combobox>span>.k-input').attr('unselectable', 'on');
简单!
只需在输入框中添加disabled
,它就无法被点击(聚焦)。
onfocus/blur方法可以用于从只读字段中移除光标,但浏览器不会自动重新聚焦到下一个字段,你可能会完全失去焦点,这不是用户通常期望的。因此,如果需要这样做,您可以使用纯JavaScript来聚焦到您想要的下一个字段,但您必须指定下一个字段:
<input type="text" name="readonly-field" value="read-only"
readonly onfocus="this.form.NextField.focus()">
'NextField'是要跳转到的字段的名称。(或者,您可以提供其他定位下一个字段的方法)。显然,如果您想导航到一些不可见的UI元素,比如选项卡面板,那么这将更加复杂,因为您还需要安排这个。