摘要：首先獲取用戶觸發(fā)字段長(zhǎng)度，根據(jù)開(kāi)發(fā)者設(shè)定的數(shù)量減去用戶輸入的字段長(zhǎng)度，求出還剩多少可輸入字段，在用js中innerHtml在頁(yè)面渲染出來(lái)，在同理去判斷按鈕是否根據(jù)這樣可否讓用戶去點(diǎn)擊去禁用，都可以實(shí)現(xiàn)，完成用戶在頁(yè)面體驗(yàn)html：<div class="text"> <div class="text_top">還可以輸入<s
首先獲取用戶觸發(fā)字段長(zhǎng)度，根據(jù)開(kāi)發(fā)者設(shè)定的數(shù)量減去用戶輸入的字段長(zhǎng)度，求出還剩多少可輸入字段，在用js中innerHtml在頁(yè)面渲染出來(lái)，在同理去判斷按鈕是否根據(jù)這樣可否讓用戶去點(diǎn)擊去禁用，都可以實(shí)現(xiàn)，完成用戶在頁(yè)面體驗(yàn)
html：
<div class="text">
<div class="text_top">還可以輸入<span class="number" id="number">20</span>個(gè)字</div>
<textarea class="text_textarea" id="textarea"></textarea>
<div class="text_bottom">
<div class="text_b1">表情</div>
<div class="text_b2">圖片</div>
<div class="text_b3">視頻</div>
<div class="text_b4">話題</div>
<div class="text_b5">微博</div>
<div class="text_b6">公開(kāi)</div>
<button class="text_button" id="onclick">發(fā)布</button>
</div>
</div>
js:
window.onload=function(){
var number,text,button;
number=document.getElementById('number')
text=document.getElementById('textarea')
button=document.getElementById('onclick')
var num;
console.log(num)
text.onkeyup=function () {
num=20
num=num-text.value.length
console.log(num)
console.log(text.value.length)
if(num<0){
number.style.color="red"
}else{
number.style.color="black"
}
number.innerHTML=num;
}
button.onclick=function(){
if(num==20){
alert('您還沒(méi)有輸入')
text.focus()
}else if(num<0){
alert('您輸入過(guò)多')
}else {
alert('發(fā)布成功')
}
}
}
批改老師：天蓬老師批改時(shí)間：2019-01-10 08:51:22
老師總結(jié)：console.log(num) , 以后提交的作業(yè) 中, 可以把這些語(yǔ)句刪除掉