Question

我在使用laravel和JS（jquery）构建的应用程序中遇到字符串截断问题。起初我认为这是一个后端问题（我问了这个问题：Laravel Truncating Strings）。仔细调试后，我注意到我的JS代码中出现了问题。

我试图通过JQuery post（AJAX）请求将一些字符串从CKEditor传递到后端，但在某些情况下，字符串会被截断，特别是包含特殊字符的嵌入！

以下是发生问题的代码段

var content = CKEDITOR.instances.editor.getData();
alert("Content :" + content + "<br> Length :" + content.length);

var data = 'post_id=' + post_id + '&content=' + content + '&_token=' + $('#token').val();
alert("Data :" + data);
alert("Content Again :" + content);

发生了什么？

我从CKEditor获取字符串
提醒调试的内容和长度，看起来都很好
我将内容连接到数据变量，后来在ajax中发送请求
警报数据显示某些情况下的截断字符串
我再次检查内容一切都很好，但由于某种原因，数据是截断。

示例???

我将这个facebook嵌入编辑器中

<iframe src="https://www.facebook.com/plugins/comment_embed.php?href=https%3A%2F%2Fwww.facebook.com%2Ftonyelumelu%2Fposts%2F10154690113371949%3Fcomment_id%3D10154690136096949&include_parent=false" width="560" height="161" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>

警告内容会显示正确的结果而不会截断。但警告数据变量

Data :post_id='+post_id+'&content=<p><iframe src="https://www.facebook.com/plugins/comment_embed.php?href=https%3A%2F

很明显，字符串被%2F有时%3A切换（我尝试了另一种嵌入）

数据变量的外观如何使用普通字符串（<p> This is some string </p>）

Data :post_id='+post_id+'&content=<p>This is some string</p>
&_token='+$('#token').val()

拜托，我做错了什么？并且一般如何在JS中避免这种截断我看到在不同的情况下多次截断字符串，这很难解释。提前致谢

Answer 1

如果content有特殊字符，让我们说它类似于You & I forever，那么您的data变量将如下所示：

post_id=1&content=You & I forever&_token=bla

看到问题？内容在You之后结束，因为＆符号未编码。所以你应该做这样的事情：

var data = 'post_id=' + post_id + '&content=' + encodeURIComponent(content) + '&_token=' + $('#token').val();

这样，您的data变量将如下所示：

post_id=1&content=You%20%26%20I%20forever&_token=bla

这一切都会顺利进行

Answer 2

更新

@ Piyin上面的答案是一种更好，更清洁的方法！但是，我留下了漫长而无聊的方法，可能会为了另一个目的而保存。

旧解决方案（不酷:) :)

因为我需要尽快解决这个问题（在生产大声笑）我用这个工作！如果遇到麻烦我们会得到更好的答案，你可以使用它：）

1）创建隐藏表单

<form id="content-form">
  <input type="hidden" name="post_id" id="content-post-id">
  <input type="hidden" name="content" id="content">
  <input type="hidden" name="_token" value="{{Session::token()}}">
</form>

2）使用JQuery（或其他）将数据传递给此表单

 var post_id = $('#post-id').val(); //get post id
 $('#content-post-id').val(post_id); //put in form
 var content = CKEDITOR.instances.editor.getData(); //get content
 $('#content').val(content); //put in form

3）使用JQuery .serialize()序列化表单（而不是＆＃34;手动＆＃34;这样做）

var data = $('#content-form').serialize();

如果你没有使用JQuery，这可能不是很酷，除非你在任何你正在使用的内容中替换序列化！

这可能不是一个好的解决方案，但它有效！我确定深入研究（代码）serialize（）函数可以帮助我（或者你）理解如何在复杂的情况下正确地序列化数据。

连接期间Javascript截断字符串

2 个答案:

更新

旧解决方案（不酷:) :)