我在表格单元格中有一堆文本输入,如下所示:
<td class="tdTextInput">
<input type="text" value="0" name="txt1_9_4_2" id="txt1_9_4_2" class="input-supermini">
</td>
每当用户点击单元格或输入时,它必须自动选择输入中的所有内容(有点像电子表格编辑器)。
所以这里的脚本到目前为止只能在可信赖的旧Firefox中成功实现。
//focus the textbox on td click
$('.tdTextInput').mousedown(function ()
{
$(this).find('input').first().focus();
});
//select all text on focus
$('.tdTextInput input').focus(function ()
{
//the data-selected attribute is used to prevent the
// autoselection to happen more than once per cell so that
// two consecutive clicks will allow the user to pinpoint the
// cursor to a specific position
var isSelected = $(this).attr('data-selected') == 'true';
if (!isSelected) {
$('input[data-selected]').removeAttr('data-selected');
$(this).attr('data-selected', 'true');
$(this).select();
}
});
//prevent non-numeric values from being added
$('.tdTextInput input').keydown(function (e)
{
CommonTools.IsNumeric(e);
});
CommonTools.IsNumeric
指的是以下内容: - (可能不相关,因为keydown函数不是问题。只在问题中添加它才能完整)
isNumeric = function (e)
{
if(!(e.which>=48 && e.which<=57)) //numeric values only
e.preventDefault();
}
为什么这只适用于FF和IE而不适用于Chrome?
更新 我在这里创造了一个小提琴:http://jsfiddle.net/dDc73/,但是它甚至不能用于小提琴中的FF或IE。
更多信息: 当我单击单元格时,它会选择所有文本,直到我释放鼠标单击。
答案 0 :(得分:6)
Refrence: Selecting text on focus using jQuery not working in Safari and Chrome
$(".tdTextInput input").mouseup(function(e){
e.preventDefault();
});
这也可能有所帮助:
Select all text on focus using jQuery
$(".tdTextInput input").live('mouseup', function () {
$(this).select();
});
答案 1 :(得分:1)
当页面加载时,让“名字”输入字段自动获得焦点:
<form action="demo_form.asp">
First name:<input type="text" name="fname" autofocus><br>
Last name: <input type="text" name="lname"><br>
<input type="submit">
</form>