我可以有条件地更改在按键上输入的字符吗?

是否可以更改已在按键上输入的字符,而无需手动操作?

例如,如果我想根据某些条件强制使用大写字母,那么执行以下操作会很好:

function onKeypressHandler(e) { if ( condition ) { e.which -= 32; } } 

但当然这不起作用。

注意:不是一个全面的大写字母,而只是特定的字符。

也许我想说if ( e.which >= 97 && e.which <= 102 )if ( Wind.Direction == 'South' )或其他 – 条件本身并不重要,但大写只能适用于当前字符不是整个输入。

我可以通过手动附加更改后的角色来实现,但这是一种丑陋而混乱的方式,并且可能比它更慢。

 function onKeypressHandler(e) { if ( condition ) { $j(this).val( $j(this).val() + String.fromCharCode( e.which - 32 ) ); return false; } } 

使用此方法的一个特定缺陷 – 如果选择所有输入文本并输入密钥,如果它落入此中,则它不会删除现有内容,而只是附加到用户想要删除的内容。 (需要调查检测任何选定的文本来解决这个问题,这使得这个问题变得更加丑陋。)

有人能提供更好的解决方案吗?

以下将完成这项工作。 这是基于我写给另一个问题的答案 。 自定义transformTypedChar函数以满足您的需求; 我的例子只用字母ag表示。

如果你需要在textarea上而不是那么请注意IE <= 8中存在问题,并且为了简洁起见,以下代码不会处理换行符。 你可以在这里找到跨浏览器功能来获取textarea中的选择: 是否有Internet Explorer批准的selectionStart和selectionEnd的替代品?

 function transformTypedChar(charStr) { return /[ag]/.test(charStr) ? charStr.toUpperCase() : charStr; } document.getElementById("your_input_id").onkeypress = function(evt) { var val = this.value; evt = evt || window.event; // Ensure we only handle printable keys, excluding enter and space var charCode = typeof evt.which == "number" ? evt.which : evt.keyCode; if (charCode && charCode > 32) { var keyChar = String.fromCharCode(charCode); // Transform typed character var mappedChar = transformTypedChar(keyChar); var start, end; if (typeof this.selectionStart == "number" && typeof this.selectionEnd == "number") { // Non-IE browsers and IE 9 start = this.selectionStart; end = this.selectionEnd; this.value = val.slice(0, start) + mappedChar + val.slice(end); // Move the caret this.selectionStart = this.selectionEnd = start + 1; } else if (document.selection && document.selection.createRange) { // For IE up to version 8 var selectionRange = document.selection.createRange(); var textInputRange = this.createTextRange(); var precedingRange = this.createTextRange(); var bookmark = selectionRange.getBookmark(); textInputRange.moveToBookmark(bookmark); precedingRange.setEndPoint("EndToStart", textInputRange); start = precedingRange.text.length; end = start + selectionRange.text.length; this.value = val.slice(0, start) + mappedChar + val.slice(end); start++; // Move the caret textInputRange = this.createTextRange(); textInputRange.collapse(true); textInputRange.move("character", start - (this.value.slice(0, start).split("\r\n").length - 1)); textInputRange.select(); } return false; } }; 

如何防止默认操作然后触发按键? 就像是,

 function onKeypressHandler(e) { if ( condition ) { e.preventDefault(); // create new event object (you may clone current e) var ne = new jQuery.Event("keypress"); ne.which = e.which - 32; $(e.target).trigger(ne); // you may have to invoke with setTimeout } } 

你必须看到这个……在我开始工作之后,我对自己非常满意。

你显然希望包含足够的标准以避免在这里进入循环。

当条件计算结果为true时,下面的代码返回false,但它使用不会返回false的不同charCode触发相同的事件。

 document.getElementById("input1").onkeypress = Handler; function Handler(e) { e = e || window.event; if ( e.charCode == 97 ) { var evt = document.createEvent("KeyboardEvent"); evt.initKeyEvent("keypress",true, true, window, false, false,false, false, 0, e.charCode -32); this.dispatchEvent(evt); return false; } return true; } 

你可以在IE中使用fireEvent …我使用http://help.dottoro.com/ljrinokx.php和https://developer.mozilla.org/en/DOM/event.initKeyEvent作为参考

不确定你想要什么,但这会有用吗?

 $('#my_element').keyup(function(){ $(this).val().toUpperCase(); }); 

或者使用子字符串来获取最后一个字符并对其执行toUpperCase()

(psst …你也可以使用keydown或keypress)。

你能用css吗?

  

彼得,

你可能会在这里找到一些灵感:

http://www.maconstateit.net/tutorials/JSDHTML/JSDHTML15/jsdhtml15-05.htm

基本上可以通过各种方式来查看“区域”周围的按键事件和function。