Html占位符文本以textarea形式

Html占位符文本以textarea形式,第1张

概述在我的一个网站上,我创建了一个表单,用于收集人员姓名,电子邮件和他们想法的描述. 我将描述的字符限制为500个字符,因为我不想阅读,我想出了如何在用户输入他们想要的内容之前将文本显示在textarea中. 目前用户必须自己删除“你的想法的描述”,但我想添加占位符类,当它们点击textarea时删除我在textarea中写的内容 我查了几个网站,无法弄清楚如何使用它我把它放在我的代码中,但通常这个类 在我的一个网站上,我创建了一个表单,用于收集人员姓名,电子邮件和他们想法的描述.

我将描述的字符限制为500个字符,因为我不想阅读,我想出了如何在用户输入他们想要的内容之前将文本显示在textarea中.

目前用户必须自己删除“你的想法的描述”,但我想添加占位符类,当它们点击textarea时删除我在textarea中写的内容

我查了几个网站,无法弄清楚如何使用它我把它放在我的代码中,但通常这个类只是作为文本出现在我的textarea中.

任何使用这个课程的帮助都会非常感谢你

这是我写的

在头部标签内

<script language="JavaScript" type="text/JavaScript">function limitText(limitFIEld,limitCount,limitNum) {    if (limitFIEld.value.length > limitNum) {        limitFIEld.value = limitFIEld.value.substring(0,limitNum);    } else {        limitCount.value = limitNum - limitFIEld.value.length;    }}</script>

身体内部的标签

<form name="form1" method="post" action="IDeas.PHP"> Your name: &nbsp;<input type="text" name="name"><br>Your Email: &nbsp;<input type="text" name="email"<br><textarea name="desc" cols=50 rows=10 onKeyDown="limitText(this.form.desc,this.form.countdown,500);" onKeyUp="limitText(this.form.desc,500);">Description of your IDea</textarea><br><Font size="1">(Maximum characters: 500)<br>You have <input Readonly type="text" name="countdown" size="3" value="500"> characters left.</Font><br><input type="submit" name="submit" value="submit!"> </form>
解决方法 查看 http://www.ajaxblender.com/howto-add-hints-form-auto-focus-using-javascript.html我觉得它有你想要的东西.

这是一个简单的页面,上面有一个我快速放在一起的电子邮件字段(主要来自教程).

<HTML><head><script type="text/JavaScript" src="http://code.jquery.com/jquery-1.4.1.min.Js"></script><script type="text/JavaScript">    $(document).ready(function(){        //  Focus auto-focus fIElds        $('.auto-focus:first').focus();        //  Initialize auto-hint fIElds        $('input.auto-hint,TEXTAREA.auto-hint').focus(function(){            if($(this).val() == $(this).attr('Title')){                $(this).val('');                $(this).removeClass('auto-hint');            }        });        $('input.auto-hint,TEXTAREA.auto-hint').blur(function(){            if($(this).val() == '' && $(this).attr('Title') != ''){                $(this).val($(this).attr('Title'));                $(this).addClass('auto-hint');            }        });        $('input.auto-hint,TEXTAREA.auto-hint').each(function(){            if($(this).attr('Title') == ''){ return; }            if($(this).val() == ''){ $(this).val($(this).attr('Title')); }            else { $(this).removeClass('auto-hint'); }        });    });</script></head><body><form>Email: <input type="text" name="email" ID="email" title="i.e. me@example.com"  /></form></body></HTML>

标题文本如果为空则放在字段中,并在用户开始键入后删除.

总结

以上是内存溢出为你收集整理的Html占位符文本以textarea形式全部内容,希望文章能够帮你解决Html占位符文本以textarea形式所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1104257.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-28
下一篇2022-05-28

发表评论

登录后才能评论

评论列表(0条)

    保存