Question

我正在尝试在输入标签的value属性中将JSON值附加到html并通过表单传递。

<div class="results"></div>
<script src="jquery.min.js"></script>
<script>
 
  var url = "MYID";

  $.getJSON(url, function(data) {

    var entry = data.feed.entry;

    var result = entry.filter(entry => entry.gsx$status.$t.length < 4); 

    var form = "<form class='gform' method='post' data-email='MYEMAIL' action='MYGOOGLEAPP'><input id='createObject' name='Submit1' type='submit' value='submit' />"
    var formend = "</form>"

    $(result).each(function() {
      // Column names will only pull from status
      $('.results').prepend(
        '<H1>INCOMING</H1>',
        '<table>',
        '<tr><th>DESCRIPTION:</th><th>PRICE:</th><th>QTY</th></tr>',
        '<tr><td>' + this.gsx$description.$t + '</td><td>' + this.gsx$price.$t + '</td><td>' + this.gsx$qty.$t + '</td></tr>',
        '<br>',
        '<tr><td>ORDER TOTAL:</td><td>$' + this.gsx$total.$t + '</td></tr>',
        '<tr><td>STATUS:</td><td>' + this.gsx$status.$t + '</td></tr>',
        '<tr><td>REG NUMBER:</td><td>' + this.gsx$regisnbrtx.$t + '</td></tr>',
        '<tr><td>CUSTOMER:</td><td>' + this.gsx$customer.$t + '</td></tr>',
        '<tr><td>SHIPPING ADDRESS:</td><td>' + this.gsx$address.$t + '</td></tr>',
        '<tr><td>DATE CREATED:</td><td>' + this.gsx$date.$t + '</td></tr>',
        '</table>',
        '<br>',
        form,
        "<input type='checkbox'  id='data'  name='data' class='selector' value=" + this.gsx$regisnbrtx.$t + ">test</input>",
        formend
      );
    });

  });

  $(document).ready(function() {
    $('#createObject').click(function() {
      var ar = [];
      $('.selector').each(function() {
        if ($(this).is(':checked')) {
          ar.push({
            reg: $(this).attr('value')
          });
        }
      });
      alert(JSON.stringify(ar));
    });
  });
</script>

因此$（document）函数有效（用另一个按钮对其进行了测试）。但是var ar中的信息没有作为表单输入的一部分传递。因此，它只是吐出空白数据。鉴于我正在努力使这项工作顺利进行，因此我遍历了我的代码以检查JS到HTML中的错误，但是我找不到任何问题。那我把传递给表单的部分弄乱了吗？

它返回的是： {“结果”：“成功”，“数据”：“ {\” Submit1 \“：[\” submit \“]}”}

谢谢！

Answer 1

要使用each遍历数组，您应该像使用它

$.each(result, function(index, value) {
// Column names will only pull from status

然后使用value代替this

我认为您遇到的问题是因为jQuery如何处理this。引用他们的页面

（也可以通过this关键字访问该值，但是Javascript总是将this值包装为Object，即使它是简单的字符串或数字值。）

jQuery each()

Answer 2

感谢@bobjoe的帮助，最终发现我可以创建一个带有html的var并成功运行。这是代码：

var input = "<input type='checkbox'  id='data'  name='data' class='selector' value='"
var inputend = "'/>"

   $(result).each(function(){
    // Column names will only pull from status
     $('.results').prepend(
        '<H1>INCOMING PURCHASE ORDER</H1>',
        '<table>',
        '<tr><th>DESCRIPTION:</th><th>PRICE:</th><th>QTY</th></tr>',
        '<tr><td>'+this.gsx$description.$t+'</td><td>'+this.gsx$price.$t+'</td><td>'+this.gsx$qty.$t+'</td></tr>',
        '<br>',
        '<tr><td>ORDER TOTAL:</td><td>$'+this.gsx$total.$t+'</td></tr>',
        '<tr><td>STATUS:</td><td>'+this.gsx$status.$t+'</td></tr>',
        '<tr><td>REG NUMBER:</td><td>'+this.gsx$regisnbrtx.$t+'</td></tr>',
        '<tr><td>CUSTOMER:</td><td>'+this.gsx$customer.$t+'</td></tr>',
        '<tr><td>SHIPPING ADDRESS:</td><td>'+this.gsx$address.$t+'</td></tr>',
        '<tr><td>DATE CREATED:</td><td>'+this.gsx$date.$t+'</td></tr>',
        '</table>',
        '<br>',
        form+input+this.gsx$regisnbrtx.$t+inputend,
        formend
        );
  });

这提供了结果中预期的数据：

{“结果”：“成功”，“数据”：“ {\”数据\“：[\” 4 \“]，\”提交1 \“：[\”提交\“]}”}}

将JS var前置为HTML形式

2 个答案: