焦點(diǎn)javascript,焦點(diǎn)效應(yīng)
javascript中怎么設(shè)置文本框獲得焦點(diǎn)
代碼如下:
創(chuàng)新互聯(lián)建站客戶idc服務(wù)中心，提供中國(guó)電信云錦天府、成都服務(wù)器、成都主機(jī)托管、成都雙線服務(wù)器等業(yè)務(wù)的一站式服務(wù)。通過(guò)各地的服務(wù)中心，我們向成都用戶提供優(yōu)質(zhì)廉價(jià)的產(chǎn)品以及開(kāi)放、透明、穩(wěn)定、高性價(jià)比的服務(wù)，資深網(wǎng)絡(luò)工程師在機(jī)房提供7*24小時(shí)標(biāo)準(zhǔn)級(jí)技術(shù)保障。
input name="pwuser" type="text" id="pwuser" class="input" value="樓盤賬號(hào)" onBlur="if(this.value=='') this.value='樓盤賬號(hào)';" onFocus="if(this.value=='樓盤賬號(hào)') this.value='';" /
input name="pwpwd" type="password" class="input1" value="******" onBlur="if(this.value=='') this.value='******';" onFocus="if(this.value=='******') this.value='';"
jquery實(shí)現(xiàn)方法
對(duì)于元素的焦點(diǎn)事件，我們可以使用jQuery的焦點(diǎn)函數(shù)focus(),blur()。
focus()：得到焦點(diǎn)時(shí)使用，和javascript中的onfocus使用方法相同。
如：
代碼如下:
$("p").focus(); 或$("p").focus(fn)
blur()：和onblur一樣。
如：
代碼如下:
$("p").blur(); 或$("p").blur(fn)
實(shí)例
代碼如下:
form
label for="searchKey" id="lbSearch"搜神馬？/label 這里label覆蓋在文本框上，可以更好的控制樣式
input id="searchKey" type="text" /
input type="submit" value="搜索" /
/form
jquery代碼
代碼如下:
$(function() {
$('#searchKey').focus(function() {
$('#lbSearch').text('');
});
$('#searchKey').blur(function() {
var str = $(this).val();
str = $.trim(str);
if(str == '')
$('#lbSearch').text('搜神馬？');
});
})
javascript 怎么樣使控件 獲得焦點(diǎn)
使用.focus()方法來(lái)獲得焦點(diǎn)
一般窗口組件都有此方法，如
window
文本
密碼
按鈕
單選按鈕
復(fù)選按鈕
選擇菜單
選擇菜單的子表項(xiàng)
文本區(qū)域
相應(yīng)的聚焦的事件是 onFocus
代碼
Script
function checkPassword(testObject) {
if (testObject.value.length 4) {
alert("密碼長(zhǎng)度不得小于四");
testObject.focus();
testObject.select();
}
}
/Script
JS中怎么定位焦點(diǎn)
body?onload="javascript:showLoginMeg('usrId','${loginForm.loginMsg}');"??//在body中定義事件??
function?showLoginMeg(logobj,loginMsg){
if?(""?!=?loginMsg){
//logobj.focus();???
alert(loginMsg);
document.getElementById(logobj).focus();??//此處的logobj是一個(gè)字符串?得把他轉(zhuǎn)換成對(duì)象進(jìn)行焦點(diǎn)的定位
}
}
pre/pre
pre/pre
div?class="translator-theme-default"?id="translator-floating-panel"?style="bottom:auto;?left:0px;?right:auto;?top:89px"
div?title="點(diǎn)擊翻譯"?id="translator-floating-panel-button"/div
/div
pre/pre
div?class="translator-theme-default"?id="translator-floating-panel"?style="bottom:auto;?left:545px;?right:auto;?top:20px"
div?title="點(diǎn)擊翻譯"?id="translator-floating-panel-button"/div
/div
div?style="padding-top:20px"?????????
p?style="font-size:12px;"版權(quán)聲明：本文為博主原創(chuàng)文章，未經(jīng)博主允許不得轉(zhuǎn)載。/p
/div
javascript中如何處理焦點(diǎn)事件
焦點(diǎn)作為javascript中的一個(gè)重要功能，基本上和頁(yè)面交互都離不開(kāi)焦點(diǎn)。但卻少有人對(duì)焦點(diǎn)管理系統(tǒng)地做總結(jié)歸納。本文就javascript中的焦點(diǎn)管理作詳細(xì)介紹
1、焦點(diǎn)元素
默認(rèn)情況下，只有表單元素可以獲得焦點(diǎn)。因?yàn)橹挥斜韱卧乜梢越换?/p>
input?type="text"?value="223"
讓非表單元素獲得焦點(diǎn)也是有辦法的，先將tabIndex屬性設(shè)置為-1，再調(diào)用focus()方法
div?id="test"?style="height:30px;width:100px;background:lightgreen"div/div
button?id="btn"div元素獲得焦點(diǎn)/button
script
btn.onclick?=?function(){
test.tabIndex?=?-1;
test.focus();????
}
test.onfocus?=?function(){
this.style.background?=?'pink';
}
/script
2、activeElement
document.activeElement屬性用于管理DOM焦點(diǎn)，保存著當(dāng)前獲得焦點(diǎn)的元素
注：該屬性IE瀏覽器不支持
div?id="test"?style="height:30px;width:100px;background:lightgreen"div/div
button?id="btn"div元素獲得焦點(diǎn)/button
script
console.log(document.activeElement);//body
btn.onclick?=?function(){
console.log(document.activeElement);//button
test.tabIndex?=?-1;
test.focus();????
console.log(document.activeElement);//div
}
/script
3、獲得焦點(diǎn)
元素獲得焦點(diǎn)的方式有4種，包括頁(yè)面加載、用戶輸入(按tab鍵)、focus()方法和autofocus屬性
【1】頁(yè)面加載
默認(rèn)情況下，文檔剛剛加載完成時(shí)，document.activeElement中保存的是body元素的引用。文檔加載期間，document.activeElement的值為null
【2】用戶輸入(按tab鍵)
用戶通?？梢允褂胻ab鍵移動(dòng)焦點(diǎn)，使用空格鍵激活焦點(diǎn)。比如，如果焦點(diǎn)在一個(gè)鏈接上，此時(shí)按一下空格鍵，就會(huì)跳轉(zhuǎn)到該鏈接
說(shuō)到tab鍵，就不能不提到tabindex屬性。tabindex屬性用來(lái)指定當(dāng)前HTML元素節(jié)點(diǎn)是否被tab鍵遍歷，以及遍歷的優(yōu)先級(jí)
1、如果tabindex=-1，tab鍵跳過(guò)當(dāng)前元素
2、如果tabindex=0，表示tab鍵將遍歷當(dāng)前元素。如果一個(gè)元素沒(méi)有設(shè)置tabindex，默認(rèn)值就是0
3、如果tabindex大于0，表示tab鍵優(yōu)先遍歷。值越大，就表示優(yōu)先級(jí)越小
【3】focus()
focus()方法用于將瀏覽器的焦點(diǎn)設(shè)置到表單字段，即激活表單字段，使其可以響應(yīng)鍵盤事件
注：前面介紹過(guò)，若非表單元素，設(shè)置為tabIndex為-1，也可以獲取焦點(diǎn)
【4】autofocus
HTML5表單字段新增了autofocus屬性，只要設(shè)置這個(gè)屬性，不用javascript就能自動(dòng)把焦點(diǎn)移動(dòng)到相應(yīng)字段
[注意]該屬性只能用于表單元素，普通元素即使設(shè)置tabIndex="-1"也不生效
【5】hasFocus()
document.hasFocus()方法返回一個(gè)布爾值，表示當(dāng)前文檔之中是否有元素被激活或獲得焦點(diǎn)。通過(guò)檢測(cè)文檔是否獲得了焦點(diǎn)，可以知道是不是正在與頁(yè)面交互
4、失去焦點(diǎn)
如果使用javascript使元素失去焦點(diǎn)，那么就要使用blur()方法
blur()方法的作用是從元素中移走焦點(diǎn)。在調(diào)用blur()方法時(shí)，并不會(huì)把焦點(diǎn)轉(zhuǎn)移到某個(gè)特定的元素上；僅僅是將焦點(diǎn)從調(diào)用這個(gè)方法的元素上面移走而已
5、焦點(diǎn)事件
焦點(diǎn)事件會(huì)在頁(yè)面獲得或失去焦點(diǎn)時(shí)觸發(fā)。利用這些事件并與document.hasFocus()方法及 document.activeElement屬性配合，可以知曉用戶在頁(yè)面上的行蹤
【1】焦點(diǎn)事件共包括下面4個(gè)
blur
blur事件在元素失去焦點(diǎn)時(shí)觸發(fā)。這個(gè)事件不會(huì)冒泡
focus
focus事件在元素獲得焦點(diǎn)時(shí)觸發(fā)。這個(gè)事件不會(huì)冒泡
focusin
focusin事件在元素獲得焦點(diǎn)時(shí)觸發(fā)。這個(gè)事件與focus事件等價(jià)，但它冒泡
focusout
focusour事件在元素失去焦點(diǎn)時(shí)觸發(fā)。這個(gè)事件與blur事件等價(jià)，但它冒泡
[注意] 關(guān)于focusin和focusout事件，除了IE瀏覽器支持DOM0級(jí)事件處理程序，其他瀏覽器都只支持DOM2級(jí)事件處理程序
javascript中，設(shè)置焦點(diǎn)什么是意思?焦點(diǎn)是干什么用的？
指定控件獲得焦點(diǎn)，比如input type="text"/對(duì)象獲得焦點(diǎn)即可輸入文本。
input type="button"/獲得焦點(diǎn)按回車鍵就是點(diǎn)擊此按鈕。
可以根據(jù)應(yīng)用配合完成一些自動(dòng)化操作，比如登錄時(shí)輸入了錯(cuò)誤的用戶名和密碼，回轉(zhuǎn)登錄頁(yè)后，可以讓用戶名輸入框自動(dòng)獲得焦點(diǎn)，避免用戶重新定位。
用javascript讓它獲得焦點(diǎn)
setframe cols="50%" id="aaa"
frame src="" name="baidu"/
frame src="" name="baidu"/
/setframe
script
document.getElementById("aaa").focus()
/script
前面加個(gè)id，你這樣是不對(duì)的，document.getElementsByName("baidu")[0].focus()這條語(yǔ)句把焦點(diǎn)放到第一個(gè)frame上，document.getElementsByName("baidu")[1].focus()
這條緊接著又把焦點(diǎn)放到第二個(gè)frame上，也就是說(shuō)你的第一條是沒(méi)有作用的，你要是想放到單個(gè)frame上其中一條語(yǔ)句就可以了
新聞名稱：焦點(diǎn)javascript,焦點(diǎn)效應(yīng)
本文網(wǎng)址：http://m.jiaotiyi.com/article/dscgghg.html