無標題文檔

.test1{width:400px;min-height:120px;max-height:300px;border:1px solid #000;background:#eee;overflow: hidden;}

.test2{width:400px;min-height:120px;max-height:300px;border:1px solid #000;background:#eee;margin-top:80px;}

.test3{margin-top:40px;background:#eee;}

contenteditabletabindex

var test1 = document.querySelector(".test1");

test1.onfocus = function(){

test1.style.background = "#f00";

}

test1.onblur = function(){

test1.style.background = "#333";

}

var test2 = document.querySelector(".test2");

test2.onfocus = function(){

test2.style.background = "#f00";

}

test2.onblur = function(){

test2.style.background = "#333";

}

var test3 = document.querySelector(".test3");

test3.onfocus = function(){

test3.style.background = "#f00";

}

test3.onblur = function(){

test3.style.background = "#333";

}

contenteditable還有一個有意思的效果，在網(wǎng)頁中按F12打開控制臺，在控制臺輸入contenteditable="true"

結(jié)果返回true就可以直接編輯當(dāng)前網(wǎng)頁的內(nèi)容。

總結(jié)

以上是生活随笔為你收集整理的html div 自动聚焦,让DIV也能够获取焦点的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。