javascript通過 onFocus onBlur來判斷焦點和失去焦點
創(chuàng)新互聯(lián)企業(yè)建站,10多年網(wǎng)站建設經(jīng)驗,專注于網(wǎng)站建設技術,精于網(wǎng)頁設計,有多年建站和網(wǎng)站代運營經(jīng)驗,設計師為客戶打造網(wǎng)絡企業(yè)風格,提供周到的建站售前咨詢和貼心的售后服務。對于成都網(wǎng)站制作、網(wǎng)站設計、外貿網(wǎng)站建設中不同領域進行深入了解和探索,創(chuàng)新互聯(lián)在網(wǎng)站建設中充分了解客戶行業(yè)的需求,以靈動的思維在網(wǎng)頁中充分展現(xiàn),通過對客戶行業(yè)精準市場調研,為客戶提供的解決方案。
input type="text" id="p" onBlur="alert('lose focus!')"
onFocus="alert('get focus')" /
jquery $("#p").blur(); $("#p").blur(fn)
或$("#p").focus(); 或$("#p").focus(fn)來處理焦點事件
前者:$("#p").blur();$("#p").focus(); 用來強制獲取或失去焦點
后者:$("#p").blur(fn),$("#p").focus(fn)則類似js的onBlur和onFocus用以處理焦點移出和獲取時事件處理!
輸入框失去焦點后,你又給它賦予焦點,并且彈出對話框,你再點擊取消,輸入框又失去焦點,然后它又被賦予焦點.....這就是個死循環(huán),所以這個alert會循環(huán)出現(xiàn)。
DIV獲取焦點(兩種方法):
DIV直接使用focus()和blur()兩個方法是無效的,需添加tabindex="0"或者contenteditable="true"屬性
①:設置div為可編輯狀態(tài),則可點擊獲取焦點,同時div的內容也是可以編輯的;如:
div
contenteditable="true"11111111111111/div
②:設置div的tabindex,此時div的內容是不可編輯的;如:
div
tabindex="0"11111111111111/div
PS:設置tabindex屬性,按鍵盤Tab鍵可讓其獲取焦點,其中tabindex的值越小在tab鍵切換的時候就會首先聚焦
在可編輯的DIV里,加上blur事件,就是當失去焦點時,獲取失去焦點的DIV的ID,然后保存到全局變量里,這樣你在做添加圖片時,可以直接讀取這個全局變量來獲取最后是哪個DIV失去了焦點。
用jquery的話,一句代碼就能為所有的DIV添加上失去焦點事件:
$("div").on("blur",function(){
var?id=$(this).prop("id");
});;
上面是為所有的DIV綁定了事件,但你可以在實際中,根據(jù)自己的需要來“縮小范圍”,比如你要監(jiān)聽的只是其中包含“edit”樣式的DIV,改成:
$("div.edit").on("blur",function(){
var?id=$(this).prop("id");
});
你要插入圖片的話,要不要記錄光標所在的位置?
DIV獲取焦點有兩種方法:
DIV直接使用focus()和blur()兩個方法是無效的,需添加tabindex="0contenteditable="true"屬性,設置div為可編輯狀態(tài),則可點擊獲取焦點,同時div的內容也是可以編輯的,
設置div的tabindex,此時div的內容是不可編輯的。
PS:設置tabindex屬性,按鍵盤Tab鍵可讓其獲取焦點,其中tabindex的值越小在tab鍵切換的時候就會首先聚焦
當前名稱:jquery失焦,jq 失去焦點
網(wǎng)頁地址:http://chinadenli.net/article22/dsdcpjc.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供企業(yè)網(wǎng)站制作、網(wǎng)站營銷、網(wǎng)站內鏈、云服務器、電子商務、移動網(wǎng)站建設
聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)