Question

我知道这是非常基本的javascript但是出于某种原因，我似乎无法在传递参数时使链接的onclick函数正常工作。

我尝试转义引号，添加不同类型的引号并将原始变量添加为字符串。

我有以下工作，但它说“XYZ未定义”

function renderLink(value, meta, record)
        {
            var type = record.data['name']; //value is XYZ  


            return '<a href="javascript:void(0);" onclick="getReport('+type+'); return false;"></a>';
        }

function getReport(type){

    alert(type);
}

Answer 1

return '<a href="javascript:void(0);" onclick="getReport('+type+'); return false;"></a>';

你需要转义字符串：

return '<a href="javascript:void(0);" onclick="getReport(\''+type+'\'); return false;"></a>';

Answer 2

如果查看呈现的HTML，您会看到问题：您的getReport电话看起来像这样：

getReport(XYZ);

我猜你想要引用它，所以：

return '<a href="javascript:void(0);" onclick="getReport(\''+type+'\'); return false;"></a>';

...呈现：

getReport('XYZ');

Live example

有些更深奥，但是当您输出onclick属性作为HTML源代码的一部分时，它当然是HTML属性，这意味着您可以使用字符实体。所以你可以使用"实体：

return '<a href="javascript:void(0);" onclick="getReport(&quot;'+type+'&quot;); return false;"></a>';

Live example

我指出这不是因为我推荐它（我没有），但是因为记住onclick属性中真正发生的事情是有用的。这是我强烈建议使用适当的事件处理程序（例如，通过addEventListener / attachEvent，或者甚至只是分配给a元素的onclick属性的原因之一它被实例化了。）

重要的是要注意，这种做法对record.data['name']的内容也非常敏感。例如，考虑如果代替XYZ而不是Tom's会发生什么。上面第一个选项的输出是

getReport('Tom's');

......这显然是一个问题。类似地，如果文本中有反斜杠，它将被视为结果上的转义字符等等 - 有点像雷区。

如果您可以更改renderLink，那么它会返回一个实际的实例化a元素而不是字符串，这就是我要做的事情：

function createLink(value, meta, record)
{
    var type = record.data['name'];         // Grab value as of when we were called
    var link = document.createElement('a');

    link.href = "javascript:void(0);";
    link.onclick = function() {             // Or even better, addEventListener / attachEvent
        getReport(type);
        return false;
    };

    return link;
}

创建了一个链接和一个闭包，可以访问type而无需将其转换为文本并再次返回。（如果您不熟悉闭包，请不要担心，closures are not complicated。）

Live example

Answer 3

getReport接收XYZ作为变量而不是字符串，你需要把它放在引号内：

return '<a href="javascript:void(0);" onclick="getReport(\''+type+'\'); return false;"></a>';

Javascript在href onclick请求中传递变量

3 个答案: