我无法在屏幕上打印列表

时间:2019-02-14 07:33:30

标签: javascript json excel

我想将我的json数据列为复选框。我写了这段代码。我正在用这种方式打印。我不知道我在哪里做错了。我从excel文件中获取了jSON数据。 textarea显示为“ undefined undefined”。你能帮忙吗?

HTML代码:

<div class="example">
  <form enctype="multipart/form-data">
    <input id="upload" type=file name="files[]">
  </form>

  <textarea 
    id="data" 
    class="form-control text-area-style" 
    rows=35 
    cols=120>
  </textarea>
</div>

JS代码:

function ExcelToJSON() {
  var list;
  document.getElementById("upload").addEventListener("change", handleFileSelect, false);
  this.parseExcel = function(file) {
    var reader = new FileReader();
    reader.onload = function(e) {
      var data = e.target.result;
      var workbook = XLSX.read(data, {
        type: "binary"
      });
      workbook.SheetNames.forEach(function(sheetName) {
          // Here is your object
          var XL_row_object = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
          var json_object = JSON.stringify(XL_row_object);
          list = JSON.parse(json_object);
          console.log(list);
          jQuery().val(json_object);

          list.forEach(function() {
              $('#data).append(' < input name = "accesories"
                type = "checkbox"
                value = "'+list.id+'" / > '+list.name+' < br / > ');
              });
          })
      };

      reader.onerror = function(ex) {
        console.log(ex);
      };

      reader.readAsBinaryString(file);
    };

  };

  function handleFileSelect(evt) {
    var files = evt.target.files; // FileList object
    var xl2json = new ExcelToJSON();
    xl2json.parseExcel(files[0]);
  }

1 个答案:

答案 0 :(得分:0)

list.forEach(function() {
              $('#data).append(' < input name = "accesories"
                type = "checkbox"
                value = "'+list.id+'" / > '+list.name+' < br / > ');
              });
          })

列表没有属性ID和名称(未定义),您正在遍历列表,但您未使用迭代项

list.forEach(function(item) { // <= forEach calls for every list item this function with the item as argument
              $('#data).append(' < input name = "accesories"
                type = "checkbox"
                value = "'+item.id+'" / > '+item.name+' < br / > ');
              });
          })

提示: 使用浏览器调试器中的构建对理解JS很有帮助。

使用Chrome按F12并在foreach函数中设置一个断点,然后执行代码,它将在给定的行上中断,然后您将看到作用域中的所有变量。 (在您的情况下,您将看到该列表是一个数组,并且没有id和name作为属性)

相关问题