php传递字符串变量到javascript的函数参数,javascript - 在onclick函数中传递字符串参数...

javascript - 在onclick函数中传递字符串参数

我想将参数(即字符串)传递给Onclick函数。 目前，我这样做：

''

例如，result.name等于字符串“Add”。当我单击此按钮时，出现错误，指出未定义添加。 由于这个函数调用与数字参数完美配合，我认为它与字符串中的符号“”有关。以前有没有人遇到这个问题？

Consec asked 2019-04-07T20:00:34Z

19个解决方案

282 votes

看起来你正在从字符串构建DOM元素。 你只需要在result.name周围添加一些引号：

''

你应该用正确的DOM方法做到这一点。

var inputElement = document.createElement('input');

inputElement.type = "button"

inputElement.addEventListener('click', function(){

gotoNode(result.name);

});

​document.body.appendChild(inputElement);​

请注意，如果这是一个循环或某事，result将在事件触发前更改，并且您需要创建一个额外的范围气泡来遮蔽变化的变量。

david answered 2019-04-07T20:00:57Z

22 votes

我建议甚至不使用HTML onclick处理程序，并使用更常见的东西，如document.getElementById。

HTML：

JavaScript的：

document.getElementById("nodeGoto").addEventListener("click", function() {

gotoNode(result.name);

}, false);

mc10 answered 2019-04-07T20:01:24Z

18 votes

对于我来说，关于在onClick中使用字符串转义以及随着参数数量增加而引起的关注，将会变得很麻烦。

以下方法将有一跳 - 单击 - 将控件转换为处理程序方法和处理程序方法，基于事件对象，可以扣除单击事件和相应的对象。

它还提供了一种更简洁的方式来添加更多参数并具有更大的灵活性。

className="btn btn-default"

onClick="invoke"

name='gotoNode'

data-arg1='1234'>GotoNode

在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 ....)。

Sairam Krish answered 2019-04-07T20:02:15Z

17 votes

我猜，你正在使用JavaScript本身创建一个按钮。 因此，代码中的错误是，它将以此形式呈现

'

在此当前状态下，229394288323131204352将被视为变量或函数调用之类的标识符。 你应该像这样逃避价值

''

Starx answered 2019-04-07T20:02:47Z

11 votes

这是发送价值或对象的一种很好的方式。

Click on this text!

var test =function(value,object){

object.innerHTML=value;

};

zokaee hamid answered 2019-04-07T20:03:11Z

5 votes

试试这个..

HTML：

a1

JavaScript的：

function a1_onclick(id) {

document.getElementById(id).style.backgroundColor = "#F00";

}

注意：确保在html代码中的''符号('a1')之间发送参数

Mawardy answered 2019-04-07T20:03:45Z

5 votes

多参数：

bounds.extend(marker.position);

bindInfoWindow(marker, map, infowindow,

'' + response[i].driver_name + '
' +

'' +moment(response[i].updated_at).fromNow() + '

Click me'

);

Zahid Rahman answered 2019-04-07T20:04:09Z

4 votes

编辑：如果要求是在HTML代码中引用全局对象(js)，则可以尝试这样做。 [不要在变量周围使用任何引号('或“)]

小提琴参考。

使用Javascript：

var result = {name: 'hello'};

function gotoNode(name) {

alert(name);

}

HTML：

​

Sandeep G B answered 2019-04-07T20:04:43Z

2 votes

你也在字符串中使用重音符号(`)

尝试：

``

有关更多信息，请访问MDN和Stackoverflow

通过Chrome，Edge，Firefox(Gecko)，Opera，Safari支持，但不支持Internet Explorer。

MJ Vakili answered 2019-04-07T20:05:28Z

2 votes

如果您的按钮是动态生成的：

您可以将字符串参数传递给javascript函数，如下面的代码：

我传递了3个参数，其中第三个是字符串参数希望这有帮助。

var btn ="";

//your javascript function

function RoomIsReadyFunc(ID, RefId, YourString)

{

alert(ID);

alert(RefId);

alert(YourString);

}

Mehdi Jalal answered 2019-04-07T20:06:06Z

1 votes

你可以传递引用或字符串值只是把函数放在快照下面的双逗号“”asp里面

Ayaat Shifa answered 2019-04-07T20:06:30Z

1 votes

对于传递多个参数，您可以通过将其与ASCII值连接来强制转换字符串，对于单引号，我们可以使用'

var str= "'"+ str+ "'";

Mr-Tc answered 2019-04-07T20:06:55Z

0 votes

对于传递多个参数，您可以通过将其与ASCII值连接来强制转换字符串，对于单引号，我们可以使用onclick()

var str= "'"+ str+ "'";

您可以传递给onclick()事件的相同参数。在大多数情况下，它适用于每个浏览器。

PVIJAY answered 2019-04-07T20:07:27Z

0 votes

#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;

}

if(data[i].socketid!=""){

$("#array").append(""+data[i].username+"");

}else{

console.log('null socketid >>', $("#userprofile").css('background-color'));

//$("#userprofile").css('background-color','#c32836 ! important');

$("#array").append(""+data[i].username+"");

$(".red_button").css('background-color','#c32836');

}

Jay Jariwala answered 2019-04-07T20:07:45Z

0 votes

if是否用于生成一组具有不同处理程序参数的按钮。[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 );//

}

}

如果我们这样做：

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”的最后一个值

Александр Боярчук answered 2019-04-07T20:08:31Z

0 votes

这是我正在使用的Jquery解决方案。

jQuery的

$("#slideshow button").click(function(){

var val = $(this).val();

console.log(val);

});

HTML

❮

❯

DamianToczek answered 2019-04-07T20:08:59Z

0 votes

如果你使用的是asp，你可以使用javascript：

HTML：

"

使用Javascript：

function EditSelectedOptionName(id, name) {

console.log(id);

console.log(name);

}

Abdullah Tahan answered 2019-04-07T20:09:26Z

-1 votes

您可以在JavaScript文件中使用此代码来添加按钮：

Cancel

SHUJAT MUNAWAR answered 2019-04-07T20:09:51Z

-1 votes

以下对我很有帮助，

HTML Form

function msg(x){

alert(x);

}

Sayan Shankhari answered 2019-04-07T20:10:15Z