很久没有用这个textarea玩意了,因为要设计一些页面,硬是从记忆的最底层挖出了这个标签,结果折腾了老半天,等到发现问题所在之后,真的令我哭笑不得。
一开始,由于习惯了写XML,就随手写下了这样的HTML代码:
<textarea name="test" cols="20" rows="4" /> 结果是,textarea后面的HTML都当作内容出现在了文本域里面了。这是第一个搞笑的地方,不支持常见的标记结束方式;
接着,我给这个textarea加上了value="test"的属性值,事实上在文本域里面什么都看不到,但是我使用如下的Javascript语句却能改变文本域里面显示的内容:document.forms[0].test.value="test";这是第二个搞笑的地方了;
最后一个搞笑的地方是最夸张的了。通常在HTML中的空格都是会被忽略的,但是在textarea开始与结束的标签之间的空格都会照单全收进入到文本域中,作为textarea的默认输入了。由于我习惯了写HTML是喜欢将两个对应的标签写在两行的,结果就可想而知,不管怎么样,当我将焦点定位至TextArea文本域的时候,光标就是不在最左边显示,这还不太要紧,更要命的是,由于这些空格的存在,输入的内容还没有到文本域边沿的时候,就自动换行了,除非你将做为默认输入的空格全部删掉了。
分享到:
相关推荐
html中的文本框textarea标签.doc
该插件完整兼容placeholder属性。插件由原生JS编写,无需任何其他插件支持,并且使用简单,只需一行JS调用即可。 博客地址:http://blog.csdn.net/qq_17076445/article/details/78212240
在网页开发中,`textarea` 是一个常用的元素,用于接收用户输入多行文本。然而,原始的 `textarea` 没有内置的功能来显示行号,这对于需要进行代码编辑或者查看多行文本的场景来说不够友好。为了提高用户体验,...
最近开发的时候做了textarea 高亮关键字,尝试过很多方法,比如用iframe,和编辑器替换,当然这也是一个方法,但是原来是用textbox的内容要达到兼容这两种方法是做不到的,所以这里是使用jquery插件和jquery核心文件搞的...
在网页设计中,`textarea` 是一种常用的表单元素,用于收集用户输入的多行文本。然而,`textarea` 的默认行为可能导致一些视觉上的问题,比如固定的高度可能会限制用户输入,而滚动条则可能破坏页面的整体美感。针对...
首先,`<textarea>`的基本结构是`<textarea></textarea>`,在这个闭合的标签对之间,你可以放入默认的文本内容,这些内容将在页面加载时显示在文本框中。例如,示例代码中的`<textarea>`包含了“请将意见输入此区域...
在HTML中,可以通过`<textarea>`标签直接显示换行效果。但是,如果需要在页面上以HTML格式展示`textarea`的内容,则需要将`\r\n`替换为` `标签。需要注意的是,直接使用` `标签在某些环境下可能会被转义为`<...
在开发Web应用时,有时我们需要实现一种功能,即在用户输入textarea时实时截取文本,这在例如富文本编辑器、聊天应用或者实时预览文本格式的场景中非常常见。Vue.js是一个流行的JavaScript框架,它提供了响应式的...
在某些场景下,我们可能需要实现一个功能,即当用户点击某个按钮时,删除`textarea`中当前光标所在行的内容。这个功能在编辑器、表单或任何需要处理多行文本的界面中都很实用。本文将详细讲解如何实现这一功能,并...
这可以通过在HTML文件的`<head>`部分添加`<script>`标签来实现,通常是从CDN(内容分发网络)上加载,如`https://code.jquery.com/jquery-3.x.min.js`。 接下来,我们编写JavaScript代码来实现`textarea`的字数限制...
源码分析和工具使用是这个话题的关键标签。这表明博客作者可能不仅提供了概念解释,还可能分享了一个具体的代码库或工具,帮助开发者直接在项目中使用或参考。通过阅读和理解这个源码,开发者可以学习到如何将这个...
标签“源码”表明这个话题可能涉及具体的代码实现,而“工具”可能意味着这些技术可以用于创建具有类似功能的网页应用或编辑器工具。 压缩包中的“光标处插入文字.html”文件可能是实现这一功能的一个示例网页,...
`textarea`标签通常与`<form>`元素一起使用,以便收集用户输入的信息并将其发送到服务器进行处理。 ### 1. `<textarea>`的基本结构 ```html <textarea id="example" name="example" rows="4" cols="50"> 默认文本 ...
`style`属性是一个强大的工具,允许开发者直接在`textarea`标签内嵌入CSS规则,以实现对文本框外观的精细控制。通过`style`,可以自定义文本框的背景色、滚动条样式、边框颜色、字体大小和颜色等视觉效果。例如,`...
最简单的方法是在`textarea`标签中直接使用`maxlength`属性: ```html <textarea name="remark" id="remark" maxlength="5" style="width:420px; height:150px;"></textarea> ``` 这里的`maxlength="5"`表示`...
目的通过点击页面上的按钮button 在textarea中的光标停留处插上文字
`textarea`标签在HTML中用于创建一个可编辑的文本区域。基本语法如下: ```html <textarea name="example" rows="5" cols="30"> 默认文本 </textarea> ``` 其中,`name`属性用于标识textarea,`rows`和`cols`...
首先,确保在你的HTML页面中引入了jQuery库,这可以通过在标签内添加以下代码来实现: ```html <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> ``` 然后,下载并引入插件的CSS和JS文件。...
标题“统计字数的textarea”涉及的是...对于标签“源码”和“工具”,我们可以理解为这可能是一个开源项目或者是一个开发者用来辅助开发的小工具。文件“text.html”可能包含了上述HTML和JavaScript代码的具体实现。
jQuery扩展函数,用于获取设置textarea中光标位置