来自字符串值的 Javascript 参数

Question

我想根据字符串中的参数数组（来自php）为TagEditor（或任何其他具有参数的插件）插件设置动态参数，我以这种方式有一个div。

<textarea class="tag-editor" type="text" name="xxxx" data-attributes-js="{placeholder:'1,2,3,4',other_para,:true,....}"></textarea>

所以我想在 JS 中获取这些参数并返回它们的评估值，以便 tagEditor 使用这些动态参数。

var $input = $('.tag-editor');
$input.tagEditor( $input.attr("data-attributes-js") );

但这不起作用，我怎样才能使这个工作呢？

Answer 1

您可以在这里更改一些内容，例如：-

$(function(){
  
  const $input = $('.tag-editor');
  const jsString = $input.attr("data-attributes-js");
  const jsObj = JSON.parse(jsString);
  
  console.log(jsObj);;
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea class="tag-editor" type="text" name="xxxx" data-attributes-js='{"placeholder":"1,2,3,4","other_para":true,"another_para":5}'></textarea>

Answer 2

不确定您的 PHP 服务器有哪些功能，但一般来说：

1. 创建一个真实的对象，然后将其字符串化
2. 以 JSON 字符串形式发送
3. 将 JSON 解析回对象
4. 将对象传递给.tag-editor()

/* Server Back-end */
/* 
this is not code for server -- it's just to provide the JSON string that would come 
from a server for demonstration purposes.
*/

let object = {initialTags: ["object", "json-stringify", "data", "json-parse", "tag-editor"]};

let data = JSON.stringify(object); 

/* Client Front-end */

$(".tag-editor").data('attributes-js', data);

data = $(".tag-editor").data('attributes-js');

object = JSON.parse(data);
  
$(".tag-editor").tagEditor(object);

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tag-editor/1.0.20/jquery.tag-editor.min.css" />

<textarea class="tag-editor"></textarea>


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tag-editor/1.0.20/jquery.tag-editor.min.js"></script>