我想将参数（即字符串）传递给 Onclick 函数。
目前，我这样做：
'<input type="button" onClick="gotoNode(' + result.name + ')" />'
例如，result.name 等于字符串“Add”。
当我点击这个按钮时，我有一个错误提示“添加未定义”。由于此函数调用与数字参数完美配合，因此我假设它与字符串中的符号“”有关。
我该如何解决这个问题？
在 onclick 函数中传递字符串参数
IT技术
javascript
html
2021-01-14 00:55:45
6个回答
看起来您正在从字符串构建 DOM 元素。你只需要在 result.name 周围添加一些引号：
'<input type="button" onClick="gotoNode(\'' + result.name + '\')" />'
不过，您确实应该使用适当的 DOM 方法来执行此操作。
var inputElement = document.createElement('input');
inputElement.type = "button"
inputElement.addEventListener('click', function(){
gotoNode(result.name);
});
document.body.appendChild(inputElement);
请注意，如果这是一个循环或其他东西，result它将在事件触发之前发生变化，您需要创建一个额外的范围气泡来隐藏不断变化的变量。
关于在 onClick 中使用字符串转义，我有几个问题，随着参数数量的增加，维护起来会变得很麻烦。
下面的做法会有一跳——点击——把控件交给一个handler方法和handler方法，基于事件对象，可以推导出点击事件和对应的对象。
它还提供了一种更简洁的方式来添加更多参数并具有更大的灵活性。
<button type="button"
className="btn btn-default"
onClick="invoke"
name='gotoNode'
data-arg1='1234'>GotoNode</button>
在 JavaScript 层：
invoke = (event) => {
let nameOfFunction = this[event.target.name];
let arg1 = event.target.getAttribute('data-arg1');
// We can add more arguments as needed...
window[nameOfFunction](arg1)
// Hope the function is in the window.
// Else the respective object need to be used
})
}
这里的优点是我们可以根据需要拥有尽可能多的参数（在上面的例子中，data-arg1、data-arg2 等）。
我建议甚至不要使用 HTMLonclick处理程序，而使用更常见的东西，例如document.getElementById.
HTML：
<input type="button" id="nodeGoto" />
JavaScript：
document.getElementById("nodeGoto").addEventListener("click", function() {
gotoNode(result.name);
}, false);
这是发送值或对象的好方法。
<!DOCTYPE html>
<html>
<body>
<h1 onclick="test('wow',this)">Click on this text!</h1>
<script>
var test = function(value,object) {
object.innerHTML= value;
};
</script>
</body>
</html>
我猜，您正在使用 JavaScript 本身创建一个按钮。因此，您的代码中的错误在于，它将以这种形式呈现
<input type="button" onClick="gotoNode(add)" />'
在当前状态下，add将被视为变量或函数调用之类的标识符。你应该像这样转义这个值
'<input type="button" onClick="gotoNode(\'' + result.name + '\')" />'