附加换行符（即 ) 到在发布请求中发送的表单字段

Question

我正在编写一些网络表单来测试学生编写的服务器作为练习。有些服务器并不完全符合课堂作业的预期规范。将 Windows 换行符（即

\r\n

）附加到浏览器生成的

POST

请求会很有用，因为某些服务器正在执行

ReadLine

，而不是使用

Content-Length:

标头计数。

我正在考虑生成以下请求（来自 IE）：

POST /Brian HTTP/1.1
Accept: text/html, application/xhtml+xml, */*
Accept-Language: en-GB
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko
Content-Type: application/x-www-form-urlencoded
Accept-Encoding: gzip, deflate
Host: localhost:43
Content-Length: 8
DNT: 1
Connection: Keep-Alive
Cache-Control: no-cache

location

但在末尾添加

\r\n

。到目前为止我的尝试是：

<form> 
Username: <input type="text" name="url" id="url4"
    onChange="document.getElementById('update4').setAttribute('action', 
    'http://localhost:43/' + document.getElementById('url4').value);"> </input> 
</form>
<form id="update4" method="post" action="http://localhost:43/">
Location: <input type="text" name="isindex" id="location5" 
 onChange="document.getElementById('location5').value = 
             document.getElementById('location5').value + '\\\r\\\n'"> </input>
<input id="mysubmit3" type="submit" value="go" ></input>
</form>

我知道向事物添加换行符可能很棘手，所以我正在寻求指导。我不希望将换行符编码为 POST 的一部分。我只想在

\r\n

命令之后发送一个原始

POST

以刷新帖子。

Answer 1

文本输入元素仅允许单行文本。根据W3C 文本输入工作草案：

输入 type=文本 – 文本输入字段

类型 =“文本”
指定其输入元素是输入元素的 value 的单行纯文本编辑控件。

...

值 = 不带换行符的字符串
指定此输入元素的值。
值：任何不包含换行符（U+000A，“LF”）或回车符（U+000D，“CR”）字符的字符串。

¹

并且根据 <input>

的 MDN 文档，其中属性 type = 'text':

|

类型 | 描述 | | -------- | ------------------------ | | | 文字 |默认值。单行文本字段。换行符会自动从输入值中删除。| ²

因此，向文本输入元素的值添加新行字符基本上是多余的。

替代解决方案可能包括：

• 添加隐藏文本区域并设置文本区域的值以包含带有换行符的文本字段的值，尽管可能很难防止学生取消隐藏文本区域并更改值。请参阅

  this phpfiddle中演示。

• 使用

  FormData 存储表单的值，添加换行符，然后使用具有更改值的表单数据提交表单。这只能通过异步提交表单来实现（例如使用 AJAX，提交到不同的目标，如 iframe、其他窗口等）。

可以通过 JavaScript 使用几种不同的技术添加新行，包括：

新行字符：
• \n

  ：

console.log("Bob\nis\ncool");

• 模板文字（参考这个答案）

console.log(`Bob 
is 
cool.`);

• String.fromCharCode()

console.log('line 1'+String.fromCharCode(10, 13)+'line 2')

---

1https://www.w3.org/TR/2012/WD-html-markup-20120315/input.text.html#input.text

2https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input

Answer 2

您是否尝试过使用实际的

textarea

 而不是键入 

textarea

？

还有

getElementByID 不正确（D 不是大写），我修复了你的转义。

而不是：

<input type="textarea" name="isindex" id="location5" 
 onChange="document.getElementByID('location5').value = 
             document.getElementById('location5').value + '\\\r\\\n'"> </input>

试试这个

<form> 
 Username: <input type="text" name="url" id="url4"
    onChange="document.getElementById('update4').setAttribute('action', 
    'http://localhost:43/' + document.getElementById('url4').value);"> </input> 
</form>
<form id="update4" method="post" action="http://localhost:43/">
Location: <textarea name="isindex" id="location5" 
 onChange="document.getElementById('location5').value = 
             document.getElementById('location5').value + '\r\n'"> </textarea>
<input id="mysubmit3" type="submit" value="go" ></input>
</form>