javascript - 将 JS var 添加到 HTML 表单中

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 中的信息没有作为表单输入的一部分传递。所以它只是吐出空白数据。鉴于我正在使用 prepend 来完成这项工作，我已经运行了我的代码来检查 JS 到 HTML 中的错误，但我找不到任何问题。那么我在传递给表单的部分是否搞砸了一些东西？

这是它返回的内容:{"结果":"成功","数据":"{\"提交1\":[\"提交\"]}"}

谢谢大家!

Answer 1

要使用 each 迭代数组，您应该像这样使用它

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

然后使用value代替this

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

(The value can also be accessed through the this keyword, but Javascript will always wrap the this value as an Object even if it is a simple string or number value.)

jQuery each()