我有一个文字输入.当输入获得焦点时,我想选择输入内的文本.
使用jQuery我会这样做:
<input type="text" value="test" />
Run Code Online (Sandbox Code Playgroud)
$("input[type=text]").click(function() {
$(this).select();
// would select "test" in this example
});
Run Code Online (Sandbox Code Playgroud)
我一直在寻找尝试找到Angular的方法,但我发现的大多数例子都是在处理一个正在观察变化的模态属性的指令.我假设我需要一个正在观察获得焦点的输入的指令.我该怎么办?
我有以下jQuery代码(类似于这个问题),可以在Firefox和IE中使用,但在Chrome和Safari中失败(没有错误,只是不起作用).任何解决方法的想法?
$("#souper_fancy").focus(function() { $(this).select() });
Run Code Online (Sandbox Code Playgroud) 我在用户点击输入框时添加了下面的代码来选择全文:
<input type="number" onclick="this.setSelectionRange(0, this.value.length)" name="quantity" />
Run Code Online (Sandbox Code Playgroud)
但我收到以下错误:
未捕获的InvalidStateError:无法在'HTMLInputElement'上执行'setSelectionRange':输入元素的类型('number')不支持选择.
我在引号中加上"回归错误"这个词,因为这显然有一些不一致的意见.有关详细信息,请访问Bugzilla中的Bug 24796.
简而言之,Google Chrome根据最新版本的WhatWG规范实施了更改:http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#input-type- attr-summary从字段
中删除了以下属性和方法<input type="number"/>.
属性:
方法:
(还有其他但这些是常用的关键)
如果您检查HTMLInputElement尝试调用方法的"数字"实例或请求属性将引发异常,则定义方法.:-(
恕我直言这是一个错误(因为功能已被删除,没有任何收获......并且有1,000个网站/应用程序通过JavaScript为这些数字输入字段提供扩展行为......但我离题了(对于那些希望要解决它请使用上面列出的bug帖子))
TL; DR
出于可用性目的,我当然希望并计划继续使用<input type="number"/>字段,因为它们向用户代理提供"提示",如果在移动设备(智能手机/平板电脑/?)上,我希望在字段为时显示数字键盘专注于默认的alpha键盘.
但是对于当前版本的Chrome(版本33.0.1750.146)和盲目实现此规范更改的任何其他浏览器,我想安全地将渲染字段转换回
<input type="text"/>
笔记:
Chrome已对我的测试中导致此错误的数字输入进行了更改
Uncaught InvalidStateError: Failed to read the 'selectionStart' property from 'HTMLInputElement': The input element's type ('number') does not support selection
我想了解为什么数字/电子邮件输入不能选择(原文如此)?
当我在文本框的焦点上时,我正试图将光标设置到开头的位置.这就是我所拥有的:
$("ID").focus(function () {
var input = this;
setTimeout(function() {
input.setSelectionRange(0, 0);
}, 0);
});
Run Code Online (Sandbox Code Playgroud)
但是每次我尝试加载脚本时都会收到此错误:
未捕获的InvalidStateError:无法在'HTMLInputElement'上执行'setSelectionRange':输入元素的类型('email')不支持选择.
猜猜我不能用setSelectionRange在电子邮件上.那么,关于如何在输入文本框中设置光标位置的任何其他解决方案(不更改类型电子邮件)?
因此,onBeforeInput处理程序接收到的事件类型为React.FormEvent<HTMLInputElement>。这是一个相当普遍的类型,不包括data属性。
据我所知,onBeforeInput接收到的事件(nativeEventsKeyboardEvent在 Firefox 中,TextEvent在 Chrome 中)将具有该data属性。
编写一个处理程序的正确方法是什么,event.data而不用 TypeScript 抱怨Property 'data' does not exist on type 'FormEvent<HTMLInputElement>'?
onBeforeInput={(e) => {
handleInput(e.data);
e.preventDefault();
}}
Run Code Online (Sandbox Code Playgroud) 这个问题出现在移动Safari的iPad IOS6上.
当用户点击输入时,我不想自动选择输入中的文本.
我有一个适用于常规浏览器的解决方案,例如Chrome:
$(document).ready(function() {
//Select text on focus for input
$("input:text").focus(focustext);
});
function focustext() {
var input = $(this);
setTimeout(function() {
input.select();
},100);
}
Run Code Online (Sandbox Code Playgroud)
但这不适用于Safari Mobile.
我已经阅读了几个关于此的线程,例如: Webkit [Chrome/Safari]的解决方法javascript选择焦点错误(在字段之间使用选项卡时) 使用jQuery选择文本焦点无法在iPhone iPad浏览器中使用
我已经在一个简单的假人中测试了建议的溶剂,但是我无法在iPad上使用它们. http://kraner.se/customers/test.html
我想为此得到一个有效的解决方案.任何人?
我不知道这是否可能(看起来不可能),但我试图找到一种方法来检测 HTML 输入标签的 onKeyDown 或 onKeyPress 事件中的结果值是什么。
我使用这些事件很重要。我不能只使用 onKeyUp,因为到那时输入已经改变了。我想首先防止它发生。我还尝试将按下的键字符附加到字符串的末尾,但这并没有考虑您在输入字段的字符串开头键入字符的情况。
有任何想法吗?我已经找了一段时间,似乎不可能,但我想我会问。
我不知道是否可能,但我需要知道使用 javascript 输入字符的具体位置。例如:
我有:162345.25,如果我想输入另外6个数字,在三到四个数字之间(1623 6 45.25),我需要知道在哪个位置输入(在本例中是第五个位置)。
我的问题是我需要知道在“按键”事件中我只能捕获按下的按键。有人知道这是否可能?
javascript ×7
jquery ×4
focus ×2
html ×2
select ×2
typescript ×2
angularjs ×1
browser ×1
css ×1
email ×1
html-input ×1
ios ×1
ipad ×1
keypress ×1
onfocus ×1
onkeypress ×1
reactjs ×1
safari ×1
w3c ×1