从数据属性获取数组

Question

我有一个给定属性的文本区域，在数据属性中我插入了一个文本。

<textarea id="txt-number" data-textset="{height: '600', content: 'test'}">

$('textarea[data-textset]').each(function() {
  var id = $(this).attr("id");
  var data = $(this).attr("data-textset");
  console.log(data);
});

我使用 foreach 是因为在某些页面中有多个具有相同数据属性的文本区域

我需要转换数组对象中数据属性上的文本。谢谢

Answer 1

将其作为 JSON 放置，稍后通过 API 安全读取.data

$('textarea[data-textset]').each(function() {
  var id = $(this).attr("id");
  var data = $(this).data("textset");
  var dataAsAttr = $(this).attr('data-textset');
  var asJson = JSON.parse(dataAsAttr);
  console.log(data, dataAsAttr, asJson);
  console.log(typeof data, typeof dataAsAttr, typeof asJson);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="txt-number" data-textset='{"height": "600"}'></textarea>

Answer 2

$(function(){
 
  
  let allobject = $('textarea[data-textset]').map(function() {
    var id = $(this).attr("id");
    var data = $(this).data("textset");
     console.log(" Height = %s content =    %s",data.height,data.content);
    return data;
  });
  
  console.log(allobject);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 
<textarea id="txt-number" data-textset='{"height": "600","content":"test"}'></textarea>
<textarea id="txt-number1" data-textset='{"height": "604","content":"test one"}'></textarea>