HTML文本区域：使用JavaScript获取包装文本？_Javascript_Html_Textarea

HTML文本区域：使用JavaScript获取包装文本？

javascript html

HTML文本区域：使用JavaScript获取包装文本？,javascript,html,textarea,Javascript,Html,Textarea,如果我有这样一个文本区： <textarea id="foo" cols=80 wrap="hard"></textarea> 浏览器将文字换行到： a b c d e f 我用某种方式抓住了这段文字–“abc\ndef”（由于wrap=hard，如果我认为不可能开箱即用，你可以使用textarea的cols值自己包装文本。从HTML的角度来看，textarea中的文本没有包装。这只是为了让你能够更好地阅读它，它的显示方式注：如果您使用jQuery，您应该使用$（'

如果我有这样一个文本区：

<textarea id="foo" cols=80 wrap="hard"></textarea>

浏览器将文字换行到：

a b c
d e f

我用某种方式抓住了这段文字–“abc\ndef”（由于

wrap=hard

，如果

我认为不可能开箱即用，你可以使用textarea的cols
值自己包装文本。从HTML的角度来看，textarea中的文本没有包装。这只是为了让你能够更好地阅读它，它的显示方式
注：如果您使用jQuery，您应该使用$（'#foo'）
而不是$（'[id=foo]'）
选择器，因为它更快（更短）。
编辑2
我能提出的唯一解决方案是创建一个带有名称的隐藏iframe，并将表单提交到该框架。然后iframe可以通过窗口与其父级进行通信。父级
并提供返回的文本（其中将包括表单正常提交时的新行…）
当然，如果您愿意，可以通过脚本调用submit
以下内容我已删去，因为它不适用于本案。。
这样做的一般方法是
alert( $('<div/>').append($('#foo').clone()).html() );

提取内部html（但是因为我们处理的是围绕元素包装的div，所以我们得到了元素html）
.html()

[编辑]

显然我误解了..要获取元素的内部文本，请使用.text（）方法
所以
这有点像黑客，但您可以在服务器上创建一个脚本，以某种格式（JSON、纯文本，任何适合您的格式）打印发布到它的内容并在需要获取脚本内容时通过AJAX将textarea发布到该脚本。
由于格式是在提交时由浏览器完成的，因此最好是让浏览器提交，但提交到您选择的位置，如iframe，您可以从表单或url参数中提取格式化文本
<html><body>
    <script type="text/javascript">
        function getURLParameter(qs, name)
        {
          var pattern = "[\\?&]"+name+"=([^&#]*)";
          var regex = new RegExp( pattern );
          var res = regex.exec( qs );
          if (res == null)
            return "";
          else
            return res[1];
        }
        function getHardWrappedText(){
            if (top.location.href !== window.location.href) return;
            var frm_url = document.getElementById('ifrm').contentDocument.URL;
            if (frm_url.indexOf('http') < 0) return;
            var text = unescape(getURLParameter(document.getElementById('ifrm').contentDocument.URL, 'bar')).replace(/\+/g,' ');
            alert(text)
        }
    </script>
    <form name="main" method="get" target="ifrm">
        <textarea id="bar" name="bar" cols=5 wrap="hard">a b c d e f</textarea>
        <input type="submit">
    </form>
    <iframe id="ifrm" name="ifrm" onload="getHardWrappedText();" style="display:none;"></iframe>
</body></html>


函数getURLParameter（qs，名称）
{
var pattern=“[\\？&]”+name+“=（[^&\\]*）”；
var regex=新的RegExp（模式）；
var res=regex.exec（qs）；
如果（res==null）
返回“”；
其他的
返回res[1]；
}
函数getHardWrappedText（）{
if（top.location.href！==window.location.href）返回；
var frm_url=document.getElementById（'ifrm'）.contentDocument.url；
if（frm_url.indexOf（'http'）<0）返回；
var text=unescape（getURLParameter（document.getElementById（'ifrm'）。contentDocument.URL，'bar'））.replace（/\+/g'）；
警报（文本）
}
a b c d e f
我假设您知道文本区域的尺寸（如果不知道，您可能只需要从DOM获取它们）
使用此选项拆分字符串。转到第XT个字符（在您的示例中为第5个字符），查看下一个字符是否为空格。如果是（或者如果前一段中没有空格），则这是拆分的位置。否则，找到前一个空格并在那里拆分
将其包装在函数中，您可以添加一些递归来查找第n行。
对于现代浏览器，包装的文本可以在以下位置找到：
这似乎与提交的内容相匹配（如图所示或所示的换行）。
换行主要用于显示目的…除非wrap=hard
-然后在提交文本时将换行添加到文本中（并且这些换行被“正确地”添加）-即，浏览器知道在何处创建了“软”换行换行符，所以它只是将这些换行符转换为硬换行符。）（这是我自己包装文本的问题-我会冒着与浏览器包装不同的风险，导致大量恐慌和混乱）对不起，这不起作用：t=$（“a b c d e f g h I”）；console.log（$（“”）。append（t.clone（））.html（）
生成“a b c d e f g h I”
，而不是“a b c\nd e f\ng h i”
（这是我要找的）对不起，.text（）
也不起作用：$（“a b c d e f g h”）.text（）
=>“a b c d e f g h”

（您想自动创建换行，换行时文本会自动换行（由于文本区域的大小）？好的..为误解道歉..这是不可能的开箱即用的..最好的方法是Ty W在他的回答中建议的..@David Wolever，看看我的最新建议..它在我的测试中似乎有效，但不知道在你的情况下它是否是一个选项..我已经考虑过了…但我认为不可能调用

su在表单上使用bmit

方法，而不实际重新加载页面（并且调用

form.submit

是我知道的硬包装文本的唯一方法）。是否有其他方法可以在不重新加载页面的情况下提交表单？使用Ajax调用不会重新加载页面。这就是Ajax的全部思想。请查看jQuery的Ajax功能。是的，但是使用Ajax也不会导致文本换行。例如，尝试使用Firebug在此表单上设置

wrap=hard

：然后尝试发布它-发布的ext不会包含换行符。这就是trie，我可以编写自己的文本换行算法……但其困难在于它很可能与浏览器的算法不匹配，并且大量的混乱会发生（例如，浏览器可能将“aaa.bb”换行为“aaa.\nbb”，而我的算法可能将其换行为“aaa.b\nb”）.但最终可能会是这样……在这种情况下，我可以添加某种“预览”，这将（在我的情况下）能够减少混乱。恐怕我需要完全相同的。但问题是，换行符取决于用户在文本区域中插入文本的位置。它并不总是按照您期望的方式换行（至少在IE8/9中不是这样）。这些答案对您有帮助吗？这确实有效，但需要服务器往返才能加载IFrame。

.append( $('#foo').clone() )

.html()

$('#foo').text();

<html><body>
    <script type="text/javascript">
        function getURLParameter(qs, name)
        {
          var pattern = "[\\?&]"+name+"=([^&#]*)";
          var regex = new RegExp( pattern );
          var res = regex.exec( qs );
          if (res == null)
            return "";
          else
            return res[1];
        }
        function getHardWrappedText(){
            if (top.location.href !== window.location.href) return;
            var frm_url = document.getElementById('ifrm').contentDocument.URL;
            if (frm_url.indexOf('http') < 0) return;
            var text = unescape(getURLParameter(document.getElementById('ifrm').contentDocument.URL, 'bar')).replace(/\+/g,' ');
            alert(text)
        }
    </script>
    <form name="main" method="get" target="ifrm">
        <textarea id="bar" name="bar" cols=5 wrap="hard">a b c d e f</textarea>
        <input type="submit">
    </form>
    <iframe id="ifrm" name="ifrm" onload="getHardWrappedText();" style="display:none;"></iframe>
</body></html>

new FormData(document.querySelector('form')).get('name')