Onclick関数にパラメーター（つまり文字列）を渡したいのですが。当分の間、私はこれを行います：
'<input type="button" onClick="gotoNode(' + result.name + ')" />'たとえば、result.nameは文字列「Add」と同じです。このボタンをクリックすると、「追加が定義されていません」というエラーが表示されます。この関数呼び出しは数値パラメーターで完全に機能するので、文字列内の記号 ""と関係があると思います。以前に誰かがこの問題を抱えていましたか？
回答:
文字列から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での文字列エスケープの使用に関するいくつかの懸念と、引数の数が増えるにつれて、維持するのが面倒になります。
次のアプローチでは、1ホップ（クリック時）でハンドラーメソッドに制御を移動し、イベントオブジェクトに基づいてハンドラーメソッドを使用して、クリックイベントと対応するオブジェクトを差し引くことができます。
また、より多くの引数を追加するためのより明確な方法を提供し、柔軟性を高めます。
<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 args as needed...
window[nameOfFunction](arg1)
//hope function is in window.
//Else the respective object need to be used
})
}ここでの利点は、必要な数の引数（上記の例ではdata-arg1、data-arg2 ....）を持つことができることです。
invoke、ボタンをクリックしても呼び出されません
JSON.stringify(obj)は、HTMLとJSON.parse(event.target.getAttribute('data-arg'))JavaScriptレイヤーで使用するだけです
HTML onclickハンドラーを使用することはお勧めせず、などのより一般的なものを使用することをお勧めしますdocument.getElementById。
HTML：
<input type="button" id="nodeGoto" />JavaScript：
document.getElementById("nodeGoto").addEventListener("click", function() {
gotoNode(result.name);
}, false);onclickそれはあなたがに機能を割り当てる必要が財産だ、関数ではありません：....onclick = function() {...};
これは、値またはオブジェクトを送信するための優れた方法です。
<!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>これを試して..
HTML：
<button id="a1" type="button" onclick="return a1_onclick('a1')">a1</button> JavaScript：
<script language="javascript" type="text/javascript">
function a1_onclick(id) {
document.getElementById(id).style.backgroundColor = "#F00";
}
</script>注：htmlコード内の（ 'a1'）のような ''記号の間に必ず引数を送信してください
また、文字列でアクサングラーブ記号（ `）を使用します
試してください：
`<input type="button" onClick="gotoNode('${result.name}')" />`より多くの情報訪問のためMDNと Stackoverflowを
Chrome、Edge、Firefox（Gecko）、Opera、Safariはサポートしていますが、Internet Explorerはサポートしていません。
ボタンが動的に生成される場合：
以下のコードのように、文字列パラメータをJavaScript関数に渡すことができます。
私は3つのパラメーターを渡しました。3番目のパラメーターは文字列パラメーターで、これが役立つことを願っています。
var btn ="<input type='button' onclick='RoomIsReadyFunc("+ID+","+RefId+",\""+YourString+"\");' value='Room is Ready' />";
//your javascript function
function RoomIsReadyFunc(ID, RefId, YourString)
{
alert(ID);
alert(RefId);
alert(YourString);
}編集：HTMLコードでグローバルオブジェクト（js）を参照する必要がある場合は、これを試すことができます。[変数を引用符（ 'または "）で囲まないでください]
フィドル参照。
JavaScript：
var result = {name: 'hello'};
function gotoNode(name) {
alert(name);
}HTML：
<input value="Hello" type="button" onClick="gotoNode(result.name)" />スナップショットの下のdoubeコンマ "" asp内に関数を置くだけで、屈折または文字列値を渡すことができます
ハンドラーの異なるパラメーターを持つ一連のボタンの生成に使用する場合。 https://www.w3schools.com/js/js_function_closures.asp
let some_button = document.createElement( "button" );
some_button.type = "button";
some_button.onclick = doWithParam( some_param );
function doWithParam( param ){
return function(){
alert( param );//<------Your code here
}
}私たちが行う場合：
some_button.onclick = foo( some_param );
function foo( param ){
alert( param );
}次に、ページを更新するたびに関数fooが開始します。
私たちが行う場合：
for( let i = 0; i < 10; ++i ){
var inputElement = document.createElement('input');
inputElement.type = "button"
inputElement.addEventListener('click', function(){
gotoNode(result.name);
});
document.body.appendChild(inputElement);
}次に、ループで作成されたすべてのボタンについて、パラメーター「result.name」の最後の値
Razorでは、パラメーターを動的に渡すことができます：@ Model.UnitNameVMs [i] .UnitNameID
<style type="text/css">
#userprofile{
display: inline-block;
padding: 15px 25px;
font-size: 24px;
cursor: pointer;
text-align: center;
text-decoration: none;
outline: none;
color: #fff;
background-color: #4CAF50; //#c32836
border: none;
border-radius: 15px;
box-shadow: 0 9px #999;
width: 200px;
margin-bottom: 15px;
}
#userprofile:hover {
background-color: #3e8e41
}
#userprofile:active {
background-color: #3e8e41;
box-shadow: 0 5px #666;
transform: translateY(4px);
}
#array {
border-radius: 15px 50px;
background: #4a21ad;
padding: 20px;
width: 200px;
height: 900px;
overflow-y: auto;
}
</style>
if(data[i].socketid!=""){
$("#array").append("<button type='button' id='userprofile' class='green_button' name="+data[i]._id+" onClick='chatopen(name)'>"+data[i].username+"</button></br>");
}else{
console.log('null socketid >>', $("#userprofile").css('background-color'));
//$("#userprofile").css('background-color','#c32836 ! important');
$("#array").append("<button type='button' id='userprofile' class='red_button' name="+data[i]._id+" onClick='chatopen(name)'>"+data[i].username+"</button></br>");
$(".red_button").css('background-color','#c32836');
}以下は私にとってとてもうまくいきます、
<html>
<head>
<title>HTML Form</title>
</head>
<body>
<form>
<input type="button" value="ON" onclick="msg('ON')">
<input type="button" value="OFF" onclick="msg('OFF')">
</form>
<script>
function msg(x){
alert(x);
}
</script>
</body>
</html>このコードは、ボタンのonclickメソッドで使用できます。
<button class="btn btn-danger" onclick="cancelEmployee(\''+cancelButtonID+'\')" > Cancel </button>