在 JSON 中传递 javascript 函数

Question

我正在尝试使用单击事件处理程序实现 jQCloud 词云。它需要我在 JSON 中传递一个 javascript 函数。

在 C# 中，我制作了动态 JSON 文本

foreach (var r in result)
{
    sbChart.Append("{\"text\": \"" + r.Key + "\", \"weight\": " + r.Count().ToString() + ", ");
    sbChart.Append("\"handlers\": { \"click\": \"function() { alert('You clicked " + r.Key + "');}\"}}, ");
}
if (sbChart.Length != 0)
{
    returnString = "[" + sbChart.ToString().Substring(0, sbChart.Length - 2) + "]";
}

我通过网络方法将此返回到我的代码所在的javascript

var words = JSON.parse(strJSON);
$('#div').jQCloud(words);

生成的 JSON 是

[
  {"text": "the", "weight": 111, "handlers": { "click": "function() { alert('You clicked the');}"}}, 
  {"text": "in", "weight": 66, "handlers": { "click": "function() { alert('You clicked in');}"}}
]

但是，由于我的函数是一个字符串，它不会作为对象执行。如果我在函数语句之前和之后删除双引号，它会在解析过程中给我Invalid Character 错误。

请任何人帮助我如何使此警报起作用？

Answer 1

非常感谢您的上述建议。但我最终使用了how to provide a click handler in JQCloud的答案

我根据自己的要求稍微修改了一下，效果很好

var tag_list = new Array();
    var obj = GetCustomJsonObj(strJSON);
    for (var i = 0; i < obj.length; i++) {
        tag_list.push({
            text: obj[i].text,
            weight: obj[i].weight,
            //link: obj[i].link,
            handlers: {
                click: function () {
                    var zz = obj[i];
                    return function () {
                        alert("you have clicked " + zz.text);
                    }
                }()
            }
        });
    }

Answer 2

如果您绝对必须以这种方式将函数传递给您的页面（请参阅下面的“但是”），您可以使用eval，因为您'是提供文本的人evaling 它没有安全问题（速度问题不是问题，并且已经存在多年）。我不确定你想用这个函数做什么，但是例如：

$(".foo").on("click", eval(words[0].handlers.click));

...将评估函数并将结果分配为与.foo 选择器匹配的元素上的点击处理程序。

但是，几乎可以肯定有更好的方法来构建事物。除了在 JSON 中传回函数，您的 JavaScript 中的这些函数可能已经在某种映射中：

var clickHandlers = {
    "the": function() { alert("You clicked the"); },
    "in": function() { alert("You clicked the"); }
};

...然后在您的 JSON 中给出密钥 ("the", "in")。

或者，假设它们与点击的内容不同，请从被点击的元素中找出点击的内容（“the”或“in”）。

或其他任何东西，但它们的共同点是这些函数是在您的 JavaScript 代码中定义的，而不是通过 JSON 发回的，然后您通过 JSON 中的信息而不是实际的信息来链接这些函数 函数。

Answer 3

函数不打算作为 JSON 传递，执行数据调用传递的任意逻辑是一个相当大的安全问题。话虽如此，使用eval 来解决这个问题。

类似

var action = eval(response[0].handlers.click); // evaluates the string as javascript, and returns the value, in this case a function.

action();