FireFox 에서 한글 onkeypress / onkeyup / onkeydown 이벤트 안먹는 버그 보완 클래스

ajax 자동 완성을 구현하는데 골머리 아팠던 점은 파폭에서 한글입력시 onkeypress 이벤트가 정상적으로 발생하지 않는다는 점이었다.... 요놈을 어떻게 해야 할지 고민 끝에 꽁수를 하나 생각해 내게 됐다.

input form 에 focus 가 들어간 경우 그 value 값을 반복해서 확인하여 변경 사항이 있을 경우 강제로 keyup 이벤트를 발생시키는 것이었다.

/*
* on-key event fix for FF on Korean input
* fires 'keyup' event when contents of input form change
* requires jQuery 1.2.x
* example: var watchInput = keyFix(inputId);
* author: Hoya, hoya@betastudios.net http://hoya.tistory.com
*/

if (typeof(beta) == "undefined")
_beta = beta = {};

if (typeof(_beta.fix) == "undefined")
_beta.fix = {};
else
alert("keyfix is already set!");

if(typeof(window.beta.instances) == "undefined")
window.beta.instances = new Array();

_beta.fix = function(targetId)
{
// this fix is only for mozilla browsers
if(jQuery.browser.mozilla == false)
return false;

var thisClass = this;
this.keyEventCheck = null;
this.db = null;
this.targetId = targetId;
window.beta.instances[this.targetId] = this;

var focusFunc = function()
{
if(!thisClass.keyEventCheck) thisClass.watchInput();
};

var blurFunc = function()
{
if(thisClass.keyEventCheck)
{
window.clearInterval(thisClass.keyEventCheck);
thisClass.keyEventCheck = null;
}
};

$("#" + this.targetId).bind("focus", focusFunc);
$("#" + this.targetId).bind("blur", blurFunc);
};

_beta.fix.prototype.watchInput = function()
{
if(this.db != $("#" + this.targetId).val())
{
// trigger event
$("#" + this.targetId).trigger('keyup');
}
this.db = $("#" + this.targetId).val();

if(this.keyEventCheck) window.clearInterval(this.keyEventCheck);
this.keyEventCheck = window.setInterval("window.beta.instances['" + this.targetId + "'].watchInput()", 100);
};

beta.fix.js 로 저장을 해서

var keyFix = new beta.fix('input_search_all');

식으로 fix를 적용하고자 하는 input form 의 id 값을 넣어 주면 된다.
input form 의 value 가 변할 때 마다 keyup 이벤트를 발생시킨다. (다른 이벤트를 발생시키고자 하는 경우에 trigger 함수의 인자를 변경하면 된다)
jQuery 라이브러리와 함께 사용을 해야 정상작동한다.

출처 : http://hoya.tistory.com/74