`

显示输入剩余字数

 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>显示输入剩余字数</title>

<script>

var maxstrlen=160;

function Q(s){return document.getElementById(s);}

function checkWord(c,textId){

len=maxstrlen;

var str = c.value;

myLen=getStrleng(str);

var wck=Q(textId);

if(myLen>len*2){

c.value=str.substring(0,i+1);

}else{

wck.innerHTML = Math.floor((len*2-myLen)/2);

}

}

function getStrleng(str){

myLen =0;

i=0;

for(;(i<str.length)&&(myLen<=maxstrlen*2);i++){

if(str.charCodeAt(i)>0&&str.charCodeAt(i)<128)

myLen++;

else

myLen+=2;

}

return myLen;

}

</script>

</head>

<body>

<div style="font-size:16px">

控制输入框字符输入,计算输入字符总数,显示剩余字数;<br>

一个英文字符算一个字符,一个中文字符算两个字符计算。

</div>

<div>


<textarea onKeyUp="javascript:checkWord(this,'wordCheck');" onblur="javascript:checkWord(this,'wordCheck');" name="content" style="height:100px;width:200px;overflow-x:hidden;overflow-y:hidden"></textarea>

</div>

<DIV>

还可以输入<span style="font-size: 26px;" id="wordCheck">160</span>个字符 </div>




<textarea onKeyUp="javascript:checkWord(this,'wordCheck1');" onblur="javascript:checkWord(this,'wordCheck1');" name="content" style="height:100px;width:200px;overflow-x:hidden;overflow-y:hidden"></textarea>

</div>

<DIV>

还可以输入<span style="font-size: 26px;" id="wordCheck1">160</span>个字符 </div>

</body>

</html>
分享到:
评论

相关推荐

    文本域输入字数倒计 可输入字数 剩余字数 类似微博输入框

    文本域输入字数倒计 可输入字数 剩余字数 类似微博

    仿微博提示可输入剩余字数

    "仿微博提示可输入剩余字数"这个项目就是一个很好的实例,它旨在模拟微博平台上的字符限制功能,帮助用户了解他们还能输入多少字符,以确保消息不超过平台规定的长度。在此,我们将深入探讨这个功能实现的关键技术和...

    javaScript边打字边显示剩余字数

    在探讨“javaScript边打字边显示剩余字数”这一主题时,我们深入解析了如何在用户输入文本的过程中实时更新并展示剩余可输入字符数量,这一功能尤其适用于留言框、评论区或表单输入限制场景,能有效提升用户体验,...

    字数输入限制按百分比例显示代码

    "字数输入限制按百分比例显示代码"是一种实现这一功能的技术,它允许开发者动态地根据输入框的总字符数限制来显示当前已输入的百分比,为用户提供实时反馈。 首先,我们要理解这个功能的基本工作原理。通常,我们会...

    textarea剩余字数

    通过jQuery或其他JavaScript库,可以实现更多高级功能,如自动完成、字数统计、自动调整高度等。例如,使用jQuery插件`autosize`可以自动调整`textarea`的高度以适应内容: ```javascript $('textarea').autosize()...

    jquery-文本框输入即时显示可输入剩余字符数

    "jquery-文本框输入即时显示可输入剩余字符数"这个功能是提升用户体验的一种常见方式,它允许用户实时看到他们在一个文本框中还能输入多少字符,避免超过限制。这种功能广泛应用于评论、留言、表单填写等场景,有助...

    Vue实现动态显示textarea剩余字数

    Vue实现动态显示textarea剩余文字数量,具体内容如下 这里我们假设允许用户输入的最多数量为200个 html代码如下: &lt;textarea maxlength="200" @input="descInput" v-model="desc" /&gt; &lt;span&gt;{{remnant}}/200...

    js计算文本域剩余字数

    为了提高用户体验,我们还可以添加一些额外的功能,比如当用户输入达到最大字数时禁用提交按钮,或者改变剩余字数显示的颜色以警告用户。 将以上代码整合到一个完整的示例中,我们可以创建一个简单的HTML页面,...

    android设置EditText空间字数并提示剩余字数

    当我们需要限制用户输入的字数,并实时显示剩余字数时,可以通过编程实现这一功能。以下将详细讲解如何在Android中设置`EditText`的字数限制及显示剩余字数。 首先,我们需要在布局文件中定义`EditText`,并可以...

    Android-AndroidEditText多行文本输入字数统计限制数量

    记得在实际应用中,考虑到用户体验,应该提供清晰的提示,告知用户当前输入的字数以及剩余字数,这样用户可以更好地控制他们的输入。同时,对于字数限制的处理应当尽可能地平滑,避免突然的文本截断造成不好的体验。

    jQuery计算文本框可输入字数代码.zip

    为了提供良好的用户体验,有时候我们需要限制文本框(input type="text")的输入字数,并实时显示剩余字数。jQuery是一个轻量级、高性能的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互等任务。在...

    输入框 文本域 字数限制

    自己做的文本框字数统计/限制插件 输入框 或者 文本域 动态显示还剩余可输入字数

    android之文本框提示剩余字数

    总的来说,"android之文本框提示剩余字数"是一个提升用户输入体验的实用功能,通过监听EditText的文字变化并实时计算,我们可以为用户提供清晰的输入反馈,帮助他们更好地控制输入内容的长度。这个功能的实现并不...

    动态显示可输入的字数提示还可以输入的字数

    在网页设计中,为了提供更好的用户体验,经常需要实时显示用户在文本输入框中可以输入的剩余字数。这种功能在各种表单、评论区或社交媒体平台中非常常见,可以帮助用户避免超过设定的字符限制。本篇文章将详细讲解...

    输入一个字,文本域中显示可输入字数减1

    - **更新显示**:将计算得到的剩余字数通过`document.getElementById("zishu").innerText`更新到页面上指定的元素中。 #### 示例代码 ```javascript function tt() { var a = document.all.textarea.value.length;...

    Android中实现在矩形框中输入文字显示剩余字数的功能

    Android中实现矩形框中输入文字显示剩余字数的功能 Android中实现在矩形框中输入文字显示剩余字数的功能是app开发中常见的一种功能,今天我们将通过实例代码分享Android实现输入框提示剩余字数功能。 知识点1:...

    字数输入限制百分比显示CSS+JS代码

    然后定义一个`updateCounter`函数,它会根据输入框的当前值更新计数器显示,并根据剩余字数决定是否应用错误样式。最后,我们为输入框添加了一个`input`事件监听器,当用户输入时触发`updateCounter`函数。 现在,...

    jQuery实时计算用户输入字数代码.zip

    4. **显示剩余字数**:将计算出的字数与允许的最大字数进行比较,并显示剩余可输入的字数。你可以创建一个 HTML 元素(如 `&lt;span&gt;`)来显示这些信息,然后用 `.text()` 更新它的内容。 5. **设置限制**:如果你需要...

    计算可以输入字数 用法

    2. **实时字符计数**:在用户输入时,我们可以使用JavaScript来实时更新剩余可输入字数,提供用户体验反馈。例如,每当用户键入一个字符,就减少计数器的值。 3. **前端验证**:在提交表单前,前端可以进行验证,...

Global site tag (gtag.js) - Google Analytics