SyntaxError：JSON.parse：意外的数据结束 - 但数据是正确的

Question

解决方案：

我只是忘记了我有一个隐藏的输入元素，其最大文件大小，也被

命中

$(this).closest(".reginput").find("input").trigger("change");

为了防止我的验证脚本处理它，它不知道如何处理它并返回导致此错误的空字符串，我添加了

.not("[type='hidden']")

排除它。 现在它的工作方式应该如此。非常感谢Jared Farrish与我碰头。 ：）

原始问题

我有一个注册表单，一次引导新用户通过一个输入，其中一个输入类型为=＆＃34; file＆＃34;。

使用jQuery，我会在用户输入内容时检查每个输入是否为文件，以决定如何验证它。我需要验证的值作为JSON格式的字符串发送到PHP脚本，使用$ .post（）和.done（）。

该文件是可选的配置文件图片，如果用户选择要上传的文件，我使用文件API检查它的大小和mime-type，它作为JSON对象发送到服务器。

第一次尝试一切顺利，服务器返回一个带有自定义响应代码的JSON格式字符串，该代码通过JSON.parse（）发送。

我还在所有输入旁边添加了一个按钮，用于在单击时触发更改事件。对于需要视觉输入以及如何发送＆＃34;的用户来说，这是一个后退。输入值。但是，如果我在图片验证后尝试按此按钮，则会出现错误

  

SyntaxError：JSON.parse：第1行第1列的意外数据结尾   JSON数据

我已经检查了AJAX调用的返回值，这是正确的：

  

{＆＃34;响应＆＃34;：＆＃34; OK＆＃34;＆＃34;名称＆＃34;：＆＃34;图像＆＃34;}

我不明白为什么这不会被正确解析，但是它可能与由不同元素触发的更改事件有关？

以下是相关代码：

使用按钮

触发更改事件

$(".sendinput").click(function(){
    if($(this).closest(".reginput").find("input").length == 0){ //if an input can't be found, operate with a select
        $(this).closest(".reginput").find("select").trigger("change");
    } else if ($(this).closest(".reginput").find("select").length == 0){ //if a select can't be found, operate with an input
        $(this).closest(".reginput").find("input").trigger("change");
    }

反应改变事件

if($(this).attr("type") !== "file"){

    //Stuff to do if the input is NOT a file

} else {
    $.post("checkinput.php",{"code":{"name":$(this).attr("name"),"size":e.target.files[0].size,"type":e.target.files[0].type}}).done(function(data){
    console.log(data);
    var datax = $.parseJSON(data);
    regCheckHandler(datax);
    });
    };
});

显示个人资料图片的预览

$("input[type=file]").change(function(event){
var prev = URL.createObjectURL(event.target.files[0]);
console.log(prev);
$("#pictureprev").css("background-image","url(" + prev + ")");
});

对于乱码！我已经匆匆忙忙了一下。

编辑：

如果我尝试切换图像文件，则会正确解析返回的值，这会触发本机更改事件。所以我认为问题必然在于trigger（）ed事件，尽管我仍然无法理解为什么！

Answer 1

好的，看看实际的代码工作，你确实有两个输入：

<div class="reginput">
  <span>Profilbilde</span>
  <input type="hidden" name="MAX_FILE_SIZE" value="2000000">
  <input tabindex="-1" title="Profilbilde er frivillig. Kun jpg/jpeg, gif eller png er tillatt" name="picture" type="file">
  <div class="sendinput"></div>
  <img src="/template/check.svg" height="30px"><br>
  <div class="regbuttons"><div class="backbox" id="back13">Tilbake</div><div class="responsebox" id="res13">Neste</div></div>
</div>

我不知道然而如果因为这些因素，但我确实注意到了某些事情＆＃34;奇怪＆＃34;：{{{ 1}}和解析错误与我的预期不同步。

所以我们有：

我希望在 console.log(data)之后发生JSON.parse()语法错误，因为这是您的代码运行的顺序。这似乎表明，事实上，除了你想要的那个之外，还有另一个点击处理程序被触发。

然后，我决定查看“网络”标签，看看发送了什么：

再次，不是我的预期。我只期望一个电话，但有两个！由于解析错误发生在第一次，我先检查一下（可能是可疑的？）电话：

回复：

这是预期的吗？这实际上与 second 不同，可能是打算调用：

它的回应：

因此，如果请求无效，您可以检查console.log(data)页面并确保其具有默认的JSON错误响应。并且还使您的选择器更具体，因此它不应该触发checkInput.php元素。 （我猜测那个元素上的流浪点击处理程序不应该存在吗？）