Question

我想将一个参数(即字符串)传递到 Onclick 函数上。

目前,我这样做:

 <input type="button" onClick="gotoNode(  + result.name +  )" />

的字符串“Add”等值。

当我点击此按钮时, 我有一个错误, 显示 Add 尚未定义。由于此函数调用一个数字参数非常有效, 我假设它与字符串中的符号“ ” 有关。

我怎样才能解决这个问题?

Answer 1

看起来您正在从字符串中构建 DOM 元素。您只需要在结果周围添加一些引号。 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);

只需注意,如果这是一个循环或某事, 结果 会在事件火灾前改变,而您需要创建额外的范围泡沫来阴影变化中的变量。

Answer 2

我对在Click上使用绳索逃逸的一些担忧,

以下方法将有一个跳 - 点击 - 将控件转到一个处理器的方法和处理器方法, 以事件对象为基础, 可以减去点击事件和相应的对象。

它还提供了一种更清洁的方式,来增加更多的论据,并具有更大的灵活性。

<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
    })
  }

这里的好处是,我们可以有尽可能多的必要论据(例如,数据-arg1、数据-arg2等)。

Answer 3

我建议甚至不要使用 HTML 点击 处理器, 并使用更常见的东西, 如 document.getElementById 。

HTML :

<input type="button" id="nodeGoto" />

JavaScript :

document.getElementById("nodeGoto").addEventListener("click", function() {
    gotoNode(result.name);
}, false);

Answer 4

这是发送一个值或对象的漂亮和整洁的方法。

<!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>

Answer 5

我猜,你正在使用 JavaScript 本身创建一个按钮。因此, 您代码中的“ 强” >error

<input type="button" onClick="gotoNode(add)" />

在当前状态下, add 将被视为变量或函数调用等标识符。您应该避开这样的值

 <input type="button" onClick="gotoNode(   + result.name +   )" />

Answer 6

试试这个...

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 ) 之间发送参数

Answer 7

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

您可以将字符串参数传递到 JavaScript 函数, 如下面的代码 :

我通过了三个参数,第三个参数是一个字符串参数。

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);
}

Answer 8

您也可以在字符串中使用重音符号 (`)

尝试 :

`<input type="button" onClick="gotoNode( ${result.name} )" />`

详情请访问MDN 和

由Chrome, Edge, Firefox (Gecko),Opera ,Safari 支持,但并不支持互联网探索者。

Answer 9

如果要求是在 HTML 代码中引用全局对象( JavaScript), 您可以尝试此选项。 [在变量周围不要使用任何引号 (或 " )

http://jsfiddle.net/gaJTb/" rel="不随从不退" >Fiddle 引用。

JavaScript :

var result = {name:  hello };
function gotoNode(name) {
    alert(name);
}

HTML :

<input value="Hello" type="button" onClick="gotoNode(result.name)" />

Answer 10

多个参数 :

bounds.extend(marker.position);
bindInfoWindow(marker, map, infowindow,
     <b>  + response[i].driver_name +  </b><br>  +
     <b>  + moment(response[i].updated_at).fromNow() +  </b>
     <button onclick="myFunction(   + response[i].id +   ,   + driversList +   )">Click me</button> 
);

Answer 11

您可以通过一个引用值或字符串值。只要将函数置于双逗号中,按下面的快照显示为“ ” :

"https://i.sstatic.net/wBE0r.png" alt="在这里输入图像描述"/ >

Answer 12

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

jQuery

$("#slideshow button").click(function(){
    var val = $(this).val();
    console.log(val);
});

HTML

<div id="slideshow">
    <img src="image1.jpg">
    <button class="left" value="back">&#10094;</button>
    <button class="right" value="next">&#10095;</button>
</div>

Answer 13

如果您需要随此关键字传递变量,以下代码有效:

var status =  Active ;
var anchorHTML =  <a href ="#" onClick = "DisplayActiveStatus(this,   + status +   )">  + data+  </a> ;

Answer 14

是否用于生成一组带有不同处理器参数的按钮。

https://www.w3schools.com/js/js_formation_clocuress.asp" rel="没有跟随 noreferrer" >JavaScript 关闭

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);
}

然后,对于循环中创建的所有按钮,参数的最后值是“结果.name”。

Answer 15

<!----  script ---->
<script>
function myFunction(x) {
  document.getElementById("demo").style.backgroundColor = x; 
}
</script>

<!---- source ---->
<p id="demo" style="width:20px;height:20px;border:1px solid #ccc"></p>

<!----  buttons & function call ----> 
<a  onClick="myFunction( red )" />RED</a> 
<a  onClick="myFunction( blue )" />BLUE</a> 
<a  onClick="myFunction( black )" />BLACK</a>

Answer 16

这是对我的工作:

$(element).attr("onClick",  functionName(  + """ + Object.attribute + """ +  ) );

在 () 中添加斜线

多个参数示例

"functionName(" + " " + parameter1 + " , " + parameter2 + " , " + parameter3 + " , " + parameter4 + " , " + parameter5 + " , " + parameter6 + " )"

Answer 17

let task = {....}

<button onclick="myFunction( ${task} )">Continue task</button></li>

Answer 18

在"https://en.wikipedia.org/wiki/microsoft_ASP.NET_Razor_view_engine"rel=“不跟随 no follown noreferrer">Razor 中,你可以动态通过参数:

<a href= javascript:void(0);  onclick= showtotextbox(@Model.UnitNameVMs[i].UnitNameID, "@Model.UnitNameVMs[i].FarName","@Model.UnitNameVMs[i].EngName","@Model.UnitNameVMs[i].Symbol" ); >@Model.UnitNameVMs[i].UnitNameID</a>

Answer 19

如果您使用“https://en.wikipedia.org/wiki/ASP.NET' rel=“nofollow noreferrer”>ASP.NET ,您可以使用 JavaScript:

HTML

<input type= button  value= test  onclick= javascript: EditSelectedOptionName(x,y)  />"

JavaScript

function EditSelectedOptionName(id, name) {
    console.log(id);
    console.log(name);
}

Answer 20

对于通过多个参数时,您可以通过将字符串与 ASCII 值混为一谈的方式将字符串投放。例如,对于单引号,我们可以使用 :

var str = "&#39;" + str + "&#39;";

您可以将相同的参数传递到 onclick () 事件。在大多数情况下, 它与每个浏览器一起工作。

Answer 21

<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 );
}

Answer 22

如果您是动态地添加按钮或链接, 面对问题, 那么这也许有帮助。我以这种方式解决了 :

var link= $(contentData1[i]).find("td:first font b a").attr("href", javascript:onClick=openWin(   + tdText +   ) );

我对HTML、jQuery和JavaScript都很新。所以也许我的代码不会被优化或语法,但它对我有用。

Answer 23

无法避免的双重报价是业务方案问题的根源。一种可以读取的办法来逃避双重报价。一种可以理解的方法是使用回推法(MDN )。这里有一个样本解决方案 :

my_btn. setAttrimitte( 点击 ), `my_ func ($ ($), ${ onclick_ var1}, ${ onclick_ var2} ) ; (点击), , ${ onclick_ var2}, ${onk_ var2} ;

Answer 24

您可以使用这个:

 <input id="test" type="button" value="  + result.name +  " /> 

$(document).on( click , "#test", function () {
    alert($(this).val());
});

它为我工作。

Answer 25

<button style="background-color: gray;color:white;" onclick="displayAlert( the message )">alert</button>
<script>
    function displayAlert(msg){
        alert(msg);
    }

</script>

Answer 26

<button onclick= viewComment("string_value"",""+comment+"")  class= btn btn-primary btn-grad > View Comment </button>;

function viewComment(empl_id, comment) { //enter code here }

Answer 27

对我而言,以下各点效果很好:

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

Answer 28

您可以在按键点击方法中使用此代码 :

<button class="btn btn-danger" onclick="cancelEmployee(  +cancelButtonID+  )" > Cancel </button>

jQuery

HTML

HTML

JavaScript

友情链接