正确输出<textarea></textarea>编辑的内容格式

最新推荐文章于 2024-08-30 10:55:41 发布
最新推荐文章于 2024-08-30 10:55:41 发布
阅读量1.7k 收藏 2
点赞数
分类专栏： JS常用小方法
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_34944535/article/details/78552115
版权 
<script type="text/javascript">
    $(function () {
        $(".contentxin").each(function() {
            var temp =  $(this).text().replace(/\n|\r\n/g,'<br/>');
            temp = temp.replace(/\s/g,"  ");
            $(this).html(temp);
        });
    })
</script>

textarea文本域中的文字格式化、反格式化及验证
Irving_Ma的博客
03-12 2655
格式化： function textareaTo(str){ var reg=new RegExp("\n","g"); var regSpace=new RegExp(" ","g"); str = str.replace(reg,"<br>"); str = str.replace(regSpace,"&nbsp;"); ...
textArea滚动条样式
11-10
js实现textArea滚动条样式，兼容多种浏览器
格式化文本域内容
ruxing.li 的专栏
06-05 2497
本函数对 form 表单提交过来的 textarea 文本域的内容进行处理。 代码清单： <?php /** * 格式化文本域内容 * @author ruxing.li * @param $string 文本域内容 * @return string */ function formatTextarea($string) { $string = nl2br ( str_re
<textarea></textarea>
Leon的专栏
03-28 4285
<textarea></textarea> HTML标签，可以指定各种想要的数据，如默认行数/列数/默认字符串等等，<textarea name="remark" id="remark" cols="40" rows="2" theme="simple" cssStyle="width:100%" placeholder="请描述该邮寄产品的大概信息" >${ib.remark }</texta
<textarea>
立业的博客
12-14 1710
■ 定义 <textarea>标签用于定义多行文本输入 ■ 使用说明 当用户输入内容较多的情况下，就不能使用文本框表单了，此时可以使用<textarea>标签 通过<textarea>标签可以轻松创建多行文本输入框，常见于留言板，评论 开发中很少使用rows和cols属性，都是通过CSS来改变大小 ■ 示例 <textarea rows="3" col...
我正在编辑【php】代码，遇到了提交后无法换行的问题 ，请帮我检查并改正错误点。我的原始代码如下： 【<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html xmlns=“http://www.w3.org/1999/xhtml”> <head> <meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” /> <title>无标题文档</title> </head> <body> <form id=“forml” name=“forml” action=“” method=“post”> <table width=“200” align=“center” border=“1”> <tr> <td width=“188”><label><textarea name=“a” id=“a” cols=“20” rows=“5” wrap=“soft”>我使用的是软回车!输出后不换行!</textarea></label></td> <td width=“351”><label><textarea name=“b” id=“b” cols=“20” rows=“5” wrap=“hard”>我使用的是硬回车!输出后自动换行!</textarea></label></td> </tr> <tr> <td colspan=“2” align=“center”><label><input type=“submit” id=“submit” name=“submit” value=“提交” /></label></td> </tr> </table> </form> <?php if($_POST[‘Submit’]==“提交”){ echo n12br($_POST[‘a’]).“<br>”; echo n12br($_POST[‘b’]); } ?> </body> </html> 】
04-03
<td width="188"><label><textarea name="a" id="a" cols="20" rows="5" wrap="soft">我使用的是软回车!输出后不换行!</textarea></label></td> <td width="351"><label><textarea name="b" id="b" cols="20" rows=...
我正在编辑【php】代码，遇到了提交后无法换行的问题 ，请帮我检查并改正错误点。我的原始代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> <form id="forml" name="forml" action="" method="post"> <table width="200" align="center" border="1"> <tr> <td width="188"><label><textarea name="a" id="a" cols="20" rows="5" wrap="soft">我使用的是软回车!输出后不换行!</textarea></label></td> <td width="351"><label><textarea name="b" id="b" cols="20" rows="5" wrap="hard">我使用的是硬回车!输出后自动换行!</textarea></label></td> </tr> <tr> <td colspan="2" align="center"><label><input type="submit" id="submit" name="submit" value="提交" /></label></td> </tr> </table> </form> <?php if($_POST['Submit']=="提交"){ echo n12br($_POST['a']);"<br>"; echo n12br($_POST['b']); } ?> </body> </html>
04-03
正确的函数应该是nl2br，也就是“new line to <br>”的缩写。这里把字母'l'错写成了数字'1'，所以函数名不正确，导致无法正常转换换行符。 接下来，查看表单的textarea部分。用户有两个textarea，一个使用wrap=...
<?php if(!$solution_name){ if($OJ_ACE_EDITOR){ if (isset($OJ_TEST_RUN)&&$OJ_TEST_RUN) $height=“400px”; else $height=“500px”; ?> <pre style=“width:90%;height:<?php echo $height?>” cols=180 rows=16 id=“source”><?php echo htmlentities($view_src,ENT_QUOTES,“UTF-8”)?></pre> <input type=hidden id=“hide_source” name=“source” value=“”/> <?php }else{ ?> <textarea style="width:80%;height:600" cols=180 rows=30 id="source" name="source"><?php echo htmlentities($view_src,ENT_QUOTES,"UTF-8")?></textarea> <?php } }else{ echo "<br><h2>指定上传文件：$solution_name</h2>"; } ?> <div class="row"> <div class="column" style="display: flex;"> <?php if ( isset($OJ_TEST_RUN) && $OJ_TEST_RUN && $spj<=1 && !$solution_name ){?> <div style=" margin-left: 60px; width: 40%; padding: 14px; flex-direction: column;"> <div style=" display: flex; border-radius: 8px; background-color: rgb(255,255,255,0.4);" id="language_span"><?php echo $MSG_Input?></div> <textarea style="width:100%" cols=40 rows=5 id="input_text" name="input_text" ><?php echo $view_sample_input?></textarea> </div> <div style=" width: 40%; flex-direction: column; "> <div style=" display: flex; border-radius: 8px; background-color: rgb(255,255,255,0.4);justify-content: space-between;" id="language_span"><?php echo $MSG_Output ?> <span class=“btn” id=result><?php echo $MSG_STATUS?></span> </div> <textarea style=" width:100%;background-color: white; " cols=10 rows=5 id="out" name="out" disabled="true" placeholder='<?php echo htmlentities($view_sample_output,ENT_QUOTES,'UTF-8')?>' ></textarea> </div> <?php } ?> <?php if (isset($OJ_TEST_RUN)&&$OJ_TEST_RUN && $spj<=1 && !$solution_name ){?> <!–运行按钮–> <input style=" margin-top: 30px; margin-left: 0 auto; width: 7%;background-color: #22ba46a3;border-color: #00fff470;height: 130px; " id=“TestRun” class=“btn btn-info” type=button value=“<?php echo $MSG_TR?>” onclick=do_test_run();> <?php }?> </div> </div> </div> <input type=“hidden” value=“0” id=“problem_id” name=“problem_id”/> </form> <?php if (isset($OJ_BLOCKLY)&&$OJ_BLOCKLY){?> <input id=“blockly_loader” type=button class=“btn” onclick=“openBlockly()” value=“<?php echo $MSG_BLOCKLY_OPEN?>” style=“color:white;background-color:rgb(169,91,128)”> <input id=“transrun” type=button class=“btn” onclick=“loadFromBlockly() " value=”<?php echo $MSG_BLOCKLY_TEST?>" style=“display:none;color:white;background-color:rgb(90,164,139)”> <div id=“blockly” class=“center”>Blockly</div> <?php }?> 不改变原功能的基础上、优化代码、简化代码、美化界面、提高效率 、直接给出优化过的完整代码
最新发布
04-03
<textarea class="code-textarea" id="source" name="source"> <?= htmlentities($view_src, ENT_QUOTES, "UTF-8") ?> </textarea> <?php endif; ?> <?php else: ?> <div class="upload-file-notice"> <h2>...
<?php if(!$solution_name){ if($OJ_ACE_EDITOR){ if (isset($OJ_TEST_RUN)&&$OJ_TEST_RUN) $height="400px"; else $height="500px"; ?> <pre style="width:90%;height:<?php echo $height?>" cols=180 rows=16 id="source"><?php echo htmlentities($view_src,ENT_QUOTES,"UTF-8")?></pre> <input type=hidden id="hide_source" name="source" value=""/> <?php }else{ ?> <textarea style="width:80%;height:600" cols=180 rows=30 id="source" name="source"><?php echo htmlentities($view_src,ENT_QUOTES,"UTF-8")?></textarea> <?php } }else{ echo "<br><h2>指定上传文件：$solution_name</h2>"; } ?> <div class="row"> <div class="column" style="display: flex;"> <?php if ( isset($OJ_TEST_RUN) && $OJ_TEST_RUN && $spj<=1 && !$solution_name ){?> <div style=" margin-left: 60px; width: 40%; padding: 14px; flex-direction: column;"> <div style=" display: flex; border-radius: 8px; background-color: rgb(255,255,255,0.4);" id="language_span"><?php echo $MSG_Input?></div> <textarea style="width:100%" cols=40 rows=5 id="input_text" name="input_text" ><?php echo $view_sample_input?></textarea> </div> <div style=" width: 40%; flex-direction: column; "> <div style=" display: flex; border-radius: 8px; background-color: rgb(255,255,255,0.4);justify-content: space-between;" id="language_span"><?php echo $MSG_Output ?> <span class="btn" id=result><?php echo $MSG_STATUS?></span> </div> <textarea style=" width:100%;background-color: white; " cols=10 rows=5 id="out" name="out" disabled="true" placeholder='<?php echo htmlentities($view_sample_output,ENT_QUOTES,'UTF-8')?>' ></textarea> </div> <?php } ?> <?php if (isset($OJ_TEST_RUN)&&$OJ_TEST_RUN && $spj<=1 && !$solution_name ){?> <!--运行按钮--> <input style=" margin-top: 30px; margin-left: 0 auto; width: 7%;background-color: #22ba46a3;border-color: #00fff470;height: 130px; " id="TestRun" class="btn btn-info" type=button value="<?php echo $MSG_TR?>" onclick=do_test_run();> <?php }?> </div> </div> </div> <input type="hidden" value="0" id="problem_id" name="problem_id"/> </form> <?php if (isset($OJ_BLOCKLY)&&$OJ_BLOCKLY){?> <input id="blockly_loader" type=button class="btn" onclick="openBlockly()" value="<?php echo $MSG_BLOCKLY_OPEN?>" style="color:white;background-color:rgb(169,91,128)"> <input id="transrun" type=button class="btn" onclick="loadFromBlockly() " value="<?php echo $MSG_BLOCKLY_TEST?>" style="display:none;color:white;background-color:rgb(90,164,139)"> <div id="blockly" class="center">Blockly</div> <?php }?> 不改变原功能的基础上、优化代码、简化代码、美化界面、提高效率
04-03
>"></textarea> </div> </div> <button class="run-btn" onclick="do_test_run()"><?= $MSG_TR ?></button> <?php endif; ?> </div> <?php if (isset($OJ_BLOCKLY) && $OJ_BLOCKLY): ?> <div class="blockly-...
<?php if(!$solution_name){ if($OJ_ACE_EDITOR){ if (isset($OJ_TEST_RUN)&&$OJ_TEST_RUN) $height="400px"; else $height="500px"; ?> <pre style="width:90%;height:<?php echo $height?>" cols=180 rows=16 id="source"><?php echo htmlentities($view_src,ENT_QUOTES,"UTF-8")?></pre> <input type=hidden id="hide_source" name="source" value=""/> <?php }else{ ?> <textarea style="width:80%;height:600" cols=180 rows=30 id="source" name="source"><?php echo htmlentities($view_src,ENT_QUOTES,"UTF-8")?></textarea> <?php } }else{ echo "<br><h2>指定上传文件：$solution_name</h2>"; } ?> <style> .button, input, optgroup, select, textarea { font-family: sans-serif; font-size: 150%; line-height: 1.15; margin: 0; background: border-box; } </style> 精简代码、美化页面
04-03
></<?= $editor_type ?>> <?php else : ?> <div class="upload-notice"> <h2>指定上传文件：<?= $solution_name ?></h2> </div> <?php endif; ?> ``` 2. **现代化样式优化：** ```css <style> .code-editor { ...
使用textarea支持编辑，实现contenteditable效果
08-30 216
类似contenteditable的效果,使用textarea支持table单元格编辑
文本域textarea
weixin_34054931的博客
05-23 436
  文本域 CreateTime--2017年5月23日15:12:08Author:Marydon 二、文本域 　　（一）语法 　　　　&lt;textarea&gt;&lt;/textarea&gt; 　　（二）用法介绍 　　　　2.2.1 页面展示 　　　　内容一定要写在标签体内，即： &lt;textarea&gt;页面要展示的默认内容&lt;/textarea&...
实现简单的编辑文本界面（用textarea）
hugejihu9的专栏
10-24 842
文章来自：源码在线https://www.shengli.me/css/113.html 1、wml文件： 2、wxss文件： js代码：    
Html—让textarea标签中的内容原格式输出的办法
haogemr的博客
06-12 1982
使用css white-space属性 white-space属性值有: normal —— 默认，空白会被浏览器忽略 pre ——空白会被浏览器保留。其行为方式类似HTML中的<pre>标签。 nowrap —— 文本不会换行，文本会在同一行继续，直到遇到 标签为止。 pre-wrap —— 保留空白符序列，但正常进行换行。 pre-line —— 合并空白符序列，但保留换行符 in...
textarea标签
Mr-k的博客
05-09 410
&lt;textarea&gt;&lt;/textarea&gt;文本框标签，在开发中总能遇到1.textarea标签，换行符不是&lt;br/&gt;,而是&lt;/n&gt;2.如果你想在textarea标签中输入默认值，并且换行显示，那么换行符就必须是\r\n，至于\r是为了保证更好的兼容性...
使用textarea以及如何在点击编辑选项时，使得textarea能获取添加的时候的值
qq_26925297的博客
05-02 1760
&lt;tr&gt; &lt;td class="td-cell-label wp20" nowrap&gt;备注:&lt;/td&gt; &lt;td class="value td-cell_editable" colspan="3"&gt; &lt;textarea id="remark" name="remar
textarea 使用
zhuchunyan_aijia的博客
05-13 1737
1. resize：是否允许拖拽textarea右下角调整大小  resize: vertical; 只允许垂直方向拖拽 resize:horizontal; 只允许水平方向拖拽 resize: none; 不允许拖拽resize: both; 允许垂直 水平 拖拽 2. 滚动条scrollbar属性、样式详解overflow内容溢出时的设置（设定被设定对象是否显示滚动条）    o
textarea中输入的文本如何带格式保存
qq_36485978的博客
07-09 6651
重点是给外层加<pre>标签，就可以保存空格和换行 <body> <div> <!-- 原文本 --> <textarea id="testText"> 1)sdfasfd 2)sadfadfa 3)sdfawer </textarea> <bu...
警惕<textarea></textarea>中的空格
welcome to daijiguo's blog
07-31 426
当html页面有一个空格，它是会显示在页面的，你找死都找不到是这个原因。 但是，要想显示多个空格，就必须用 了
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值