javascript - 将换行符(即\r\n)附加到在发布请求中发送的表单字段

Question

我正在编写一些 Web 表单，用于测试学生编写的服务器作为练习。一些服务器并不完全符合规范，正如类作业所预期的那样。将 Windows 换行符(即 \r\n)附加到浏览器生成的 POST 请求会很有用，因为某些服务器正在执行 ReadLine 而不是使用 Content-Length: header 计数。

我正在考虑生成以下请求(来自 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 的一部分。我只想在 POST 命令之后发送一个原始的 \r\n 来刷新帖子。

Answer 1

文本输入元素只允许单行文本。根据 W3C Working Draft for text input :

input type=text – text-input field

type = "text"
Specifies that its input element is a one-line plain-text edit control for the input element’s value.

...

value = string without line breaks
Specifies a value for this input element.
value: Any string that contains no line feed (U+000A, “LF”) or carriage return (U+000D, “CR”) characters.

¹

根据the MDN documentation for <input> 其中属性 type = 'text':

text: A single-line text field. Line-breaks are automatically removed from the input value.²

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

替代解决方案可能包括:

• 添加隐藏文本区域并将文本区域的值设置为包含带有换行符的文本字段的值，尽管可能很难防止学生取消隐藏文本区域并更改值(value)。请参阅 this phpfiddle 中的演示.

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

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

• 换行符:\n :

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

• template literals (引用this answer)

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

• String.fromCharCode ()

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

---

¹_{https://www.w3.org/TR/2012/WD-html-markup-20120315/input.text.html#input.text}

²_{https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input}