微信公眾平台開發時,客戶提需求“輸入框中輸入內容時,輸入框后邊顯示清除按鈕,清除輸入框中的內容”,使用“keyup”事件時在中文輸入法下部分按鍵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>
