在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ 關(guān)于innerHTML改變div文本內(nèi)容無(wú)效的問(wèn)題

關(guān)于innerHTML改變div文本內(nèi)容無(wú)效的問(wèn)題

這個(gè)問(wèn)題折騰我一晚上了,因?yàn)橛X(jué)得是很簡(jiǎn)單的問(wèn)題,沒(méi)想到是哪出錯(cuò)了,請(qǐng)各位幫我看一下;
問(wèn)題描述:
一個(gè)簡(jiǎn)單的表單驗(yàn)證的demo,在Input里輸入文本之后,通過(guò)button的click事件處理函數(shù)驗(yàn)證輸入的文本,然后我用innerHTML去改變文本的內(nèi)容,發(fā)現(xiàn)無(wú) 用;emmmm;

各種搜索也沒(méi)有看到說(shuō)innerHTML改變div文本內(nèi)容無(wú)效

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="../../../bootstrap-3.3.7-dist/css/bootstrap.css">
        <link rel="stylesheet" href="main.css">
        <!-- <script src="test.js"></script> -->
    </head>
    <body>
        <div class="container">
            <div class="row">
                <div class="col-md-8 col-md-offset-2">
                    <form class="form-horizontal">
                        <div class="form-group">
                           <label for="username" class="col-sm-2 control-label"> 名稱</label>
                           <div class="col-sm-7">
                           <input type="text" id="username" class="form-control" placeholder="請(qǐng)輸入用戶名">
                           </div>
                           <button class="btn btn-primary">驗(yàn)證</button>
                        </div>
                        <div class="form-group">
                            <div class="col-sm-offset-2 col-sm-10" id="desc">必填,長(zhǎng)度為4-16個(gè)字符</div>
                        </div>
                    </form>
            </div>
        </div>
        </div>
        <script>
            window.onload=function (){
    var btn=document.getElementsByClassName("btn")[0];
    var desc=document.getElementById("desc");
    btn.addEventListener("click",valihandler,false);
    // console.log(desc.innerHTML)
    function valihandler(e){
        var user=document.getElementById("username").value;
        var pat=/\w{4,16}/;
        var namelen=user.length;
        if(namelen==0){
            console.log(desc);
            desc.innerHTML='格式錯(cuò)誤';
        };
    }

   
}
        </script>
    </body>
</html>
回答
編輯回答
雅痞

并不是無(wú)效,而是因?yàn)轫?yè)面刷新,變成了初始值
我不知道你到底想干什么,所以說(shuō)一個(gè)簡(jiǎn)單的解決方法,
直接去掉form元素,
如果不滿意繼續(xù)提要求

2017年8月21日 00:10