时间戳

首页 > 解决方案 > 将json数据从JS每个循环传递到JS函数时输入错误意外结束

javascript - 将json数据从JS每个循环传递到JS函数时输入错误意外结束

问题描述

我在表中有一个 jquery foreach 附加列表。我想要的是传递我从 ajax 成功函数中获得的完整对象。但是当我尝试将 Object 作为参数传递给不同的 JS 函数时，该参数会意外结束输入。

这是我的附表：

$.ajax({
    type: "post",
    url: "@Url.Content("~/Estimate/GetOffsetLetterHeadCost")",
    data: $('#OffLetterHeadForm').serialize(),
    datatype: "json",
    traditional: true,
    success: function(data) {
        var Json = data;
        $.each(Json, function(index, obj) {
            var row = '<tr>' + '<td><b>' + obj.VendorName + '</b></td>' 
                + '<td><label id="machineId' + index + '">' 
                + obj.MachineName + ' </label></td>' 
                + '<td><input type="button" value="Order" id="btn' 
                + index + '"onclick="SaveOffsetOrder(' 
                + JSON.stringify(obj) + ')"/></td></tr>';

                $("#AllVendorsList").append(row);
        });
    }
});

<table id="AllVendorsList"></table>

function SaveOffsetOrder(obj) {  
  // do something with obj
}

在输入关闭时，我得到了输入的意外结束。请帮忙。我是 javascript 新手

在此处输入图像描述

标签： javascriptjqueryasp.net-mvc

解决方案

问题是 JSON.stringify(obj) 不会像 \" 这样转义引号，结果是无效的 html。

我建议使用 jQuery onclick 绑定，这样您就不必对 obj 进行字符串化然后解析它。

解决方案：https ://jsfiddle.net/xpvt214o/452188/

var Json = [{
  VendorName: 'kia',
    MachineName: 'ceed'
  }, {
  VendorName: 'dacia',
    MachineName: 'logan'
}];

$.each(Json, function(index, obj) {
  var row = '<tr>' + '<td> <b>' + obj.VendorName + '</b></td>' + '<td><label id="machineId' + index + '">' + obj.MachineName + '</label></td>' + '<td><input type="button" value="Order" id="btn' + index + '"/></td></tr >';

  $("#AllVendorsList").append(row);
  $("#btn" + index).on('click', $.proxy(SaveOffsetOrder, this, obj));
});

function SaveOffsetOrder(obj) {
  console.info(obj);
}
<table id="AllVendorsList"></table>

推荐阅读