javascript---input輸入框自動聚焦優化

實現原理:
1、當打開註冊或者登錄的頁面時候,默認聚焦到第一個Input(多爲用戶名對應的那個Input)。
2、有種因素當js還沒加載完,此時頁面先加載完畢並且用戶已經填寫到了第二個Input(多爲密碼對應的那個Input)了,此時就不需要再聚焦到第一個輸入框了。

根據上邊的原理,可以編寫的代碼如下

第一種方法:原生js

<script type="text/javascript" language="javascript">
    window.onload = function(){
        if(document.forms.length>0){
            for(i=0;i<document.forms[0].elements.length; i++){
                var Input = document.forms[0].elements[i];
                if(Input.type!="hidden" && Input.value.length>0){
                    Input.blur();
                    return;
                }else if(Input.type!="hidden"){
                 Input.focus();return
                }
        }
    }
</script>
第二種方法:利用jquery

<script type="text/javascript" language="javascript">
   $(function(){
        if($('form').length>0){
            var formArr = $('form');
            var firstFromInp= $(formArr[0]).children('input:not(:hidden)');
            for(i=0;i<firstFromInp.length;i++){
                var Input = $(firstFromInp[i]).val();
                if(Input){
                    $(firstFromInp[i]).blur();
                    return;
                }else{
                    $(firstFromInp[i]).focus();
                    return;
                }
            }
        }
    });
</script>



發佈了39 篇原創文章 · 獲贊 15 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章