Chrome 輸入法 檢測-輸入轉大寫
- compositionstart：在輸入中文或者語音等需要等待一連串的輸入的操作之前，
compositionstart事件會觸發。 - compositionend：在輸入中文或者語音等完畢或取消時，
compositionend事件會觸發。
結合 Keydown +compositionstart+compositionend 解決輸入法問題，輸入法下，不對結果做任何處理。
輸入法下，輸入過快 keyup 依然會獲取到 keycode 不為 229 的程式碼，且 keyup 不能 取消輸入，只能 選擇 keydown
//input 輸入小寫轉大寫
function inputKeydown2UpperCase(obj, parentObj) {
if (!(typeof (parentObj) === "string")) {
parentObj = "";
}
if (typeof (obj) === "string") {
if(!ObjectIsEmpty(obj))
{
if (obj.substr(0, 1) != "#")
obj = "#" + obj;
}
}
$(obj, parentObj).bind('compositionstart.Michael', function (event) {
console.log('compositionstart', event);
$(this).data('ime', true);
});
$(obj, parentObj).bind('compositionend.Michael', function (event) {
console.log('compositionend', event);
$(this).data('ime', null);
});
$(obj, parentObj).bind('blur.Michael', function () { $(this).data('ime', null); });
$(obj, parentObj).bind('keydown.Michael', function (event) {
if (!event) {
event = window.event;
}
var keyCode = (event.keyCode || event.which);
var ime = $(this).data('ime');
if (keyCode != 229 && keyCode >= 48 && keyCode <= 90) {
if (ObjectIsEmpty(ime)) {
var cursor_pos = getInputSelection(this);//游標區間位置
//console.log(cursor_pos);
var realkey = String.fromCharCode(keyCode);
var isShift = event.shiftKey || (keyCode == 16) || false; // shift鍵是否按住
if (isShift) {
if (!ObjectIsEmpty(cursor_pos)) {
this.value = this.value.substr(0, cursor_pos.start) + realkey.toLowerCase() + this.value.substr(cursor_pos.end);
setCaretPosition(this, cursor_pos.end + 1);
} else {
this.value += realkey.toLowerCase();
}
}
else {
if (!ObjectIsEmpty(cursor_pos)) {
this.value = this.value.substr(0, cursor_pos.start) + realkey.toUpperCase() + this.value.substr(cursor_pos.end);
setCaretPosition(this, cursor_pos.end + 1);
} else {
this.value += realkey.toUpperCase();
}
}
}
event.returnValue = false;
return false;
}
});
}
//獲取游標位置函式
function getCursortPosition(ctrl) {
var CaretPos = 0; // IE Support
if (document.selection) {
ctrl.focus();
var Sel = document.selection.createRange();
Sel.moveStart('character', -ctrl.value.length);
CaretPos = Sel.text.length;
}
// Firefox support
else if (ctrl.selectionStart || ctrl.selectionStart == '0')
CaretPos = ctrl.selectionStart;
return (CaretPos);
}
//設定游標位置函式
function setCaretPosition(ctrl, pos) {
if (ctrl.setSelectionRange) {
ctrl.focus();
ctrl.setSelectionRange(pos, pos);
}
else if (ctrl.createTextRange) {
var range = ctrl.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
}
//獲取控制元件選中值
function getInputSelection(el) {
var start = 0, end = 0, normalizedValue, range, textInputRange, len, endRange;
//判斷是否可直接取出選擇索引
if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") {
start = el.selectionStart;
end = el.selectionEnd;
} else {
range = document.selection.createRange();
if (range && range.parentElement() == el) {
len = el.value.length;
normalizedValue = el.value.replace(/\r\n/g, "\n");
// Create a working TextRange that lives only in the input
textInputRange = el.createTextRange();
textInputRange.moveToBookmark(range.getBookmark());
// Check if the start and end of the selection are at the very end
// of the input, since moveStart/moveEnd doesn't return what we want
// in those cases
endRange = el.createTextRange();
endRange.collapse(false);
if (textInputRange.compareEndPoints("StartToEnd", endRange) > -1) {
start = end = len;
} else {
start = -textInputRange.moveStart("character", -len);
start += normalizedValue.slice(0, start).split("\n").length - 1;
if (textInputRange.compareEndPoints("EndToEnd", endRange) > -1) {
end = len;
} else {
end = -textInputRange.moveEnd("character", -len);
end += normalizedValue.slice(0, end).split("\n").length - 1;
}
}
}
}
//返回
return {
start: start,
end: end
};
}