移動端、手機網站中文IME下keyup事件部分按鍵無效

標籤：style   blog   color   io   ar   使用   java   sp   div   

公眾平台開發時，客戶提需求“輸入框中輸入內容時，輸入框後邊顯示清除按鈕，清除輸入框中的內容”，使用“keyup”事件時在中文IME下部分按鍵keyup事件無效， 以下為解決方案。

綁定“input”和“propertychange”事件可以解決，以下為代碼：

    var bind_name="input";//定義所要綁定的事件名稱    if(navigator.userAgent.indexOf("MSIE")!=-1) bind_name="propertychange";//判斷是否為IE核心 IE核心的事件名稱要改為propertychange    /*輸入框鍵盤離開事件綁定*/    $("input").bind(bind_name,function(){        if(this.value!=null&&this.value!=""){            var inputWidth=$(this).outerWidth();            var inputHeight=$(this).outerHeight();            var inputOffset =  $(this).offset();            var inputTop=inputOffset.top;            var inputLeft=inputOffset.left;            $("#clearDiv").css({top:inputTop+2,left:inputLeft+inputWidth-27}).show();            inputObj=this        }else{            $("#clearDiv").hide();        }    });

另外網上還有另一種解決方案，具體思路為給輸入框註冊focus事件，隔段時間去檢索下，我個人還是比較傾向於上面那種方法的，以下為第二種方案代碼：

<script language="javascript" type="text/javascript" src="jquery.js"></script>    <script>    $(function () {        $(‘#wd‘).bind(‘focus‘,filter_time);    })    var str = ‘‘;    var now = ‘‘    filter_time = function(){        var time = setInterval(filter_staff_from_exist, 100);        $(this).bind(‘blur‘,function(){            clearInterval(time);        });    };    filter_staff_from_exist = function(){        now = $.trim($(‘#wd‘).val());        if (now != ‘‘ && now != str) {            console.log(now);        }        str = now;    }    </script>

移動端、手機網站中文IME下keyup事件部分按鍵無效