我有一个满足于“可编辑”ID的div。 我希望最终结果是用户键入,但是不是物理键事件,而是显示预定的消息。
例如,如果预定的消息是单词“Sing”,那么无论用户首先输入什么字母,出现的第一个字母是“S”,在第二个按键上是“i”会出现,等等。
我在这个论坛上找到了模拟改变与关键事件相关的角色的代码,并且我修改了代码以实现我的例子中的“S”。我已粘贴下面的代码并在此处创建:http://jsfiddle.net/Ukkmu/61/
这段代码当然给了我“S”无限次。我卡住的地方只执行一次这个功能,然后调用“i”的另一个函数,然后调用“n”等等。
我已经在切换功能上获得了一个可能的导致,我认为可能有用,但是无法辨别如何将其应用到我的代码中。
function transformTypedCharacter(charStr) {
return /[a-z]/.test(charStr) ? "S" : /[A-Z]/.test(charStr) ? "S" : charStr;
}
function insertTextAtCursor(text) {
var sel, range, textNode;
if (window.getSelection) {
sel = window.getSelection();
if (sel.getRangeAt && sel.rangeCount) {
range = sel.getRangeAt(0).cloneRange();
range.deleteContents();
textNode = document.createTextNode(text);
range.insertNode(textNode);
// Move caret to the end of the newly inserted text node
range.setStart(textNode, textNode.length);
range.setEnd(textNode, textNode.length);
sel.removeAllRanges();
sel.addRange(range);
}
} else if (document.selection && document.selection.createRange) {
range = document.selection.createRange();
range.pasteHTML(text);
}
}
$("#editable").keypress(function(evt) {
if (evt.which) {
var charStr = String.fromCharCode(evt.which);
var transformedChar = transformTypedCharacter(charStr);
if (transformedChar != charStr) {
insertTextAtCursor(transformedChar);
return false;
}
}
});
答案 0 :(得分:0)
请改用:
var list = "Sing".split('');
function transformTypedCharacter(charStr) {
return /[a-zA-Z]/.test(charStr) ? list.shift()||" " : charStr;
}
但是我不确定这是否真的是最佳方法,因为transformTypedCharacter
可能不会以预期输出字符串的线性方式调用。如果你点击退格键,你可能会返回一些字符两次,如果你点击变音符号等,它会被插入你的结果中的某个地方。