繁体   English   中英

使用 javascript 更改 onClick 属性

[英]Change onClick attribute with javascript

这是我的函数,它应该改变 HTML 输入的 onClick 属性,但如果我使用

document.getElementById('buttonLED'+id).onclick = "writeLED(1,1)";

它根本不起作用,但如果我使用

document.getElementById('buttonLED'+id).onclick = writeLED(1,1);

该函数自行执行! 任何想法在单击按钮之前,我必须使用什么代码来更改 onCLick 属性而不执行该函数?
如果重要的话,这是完整的功能:

function showLED(id){
    if(color == 0){
        document.getElementById('buttonLED'+id).onclick = "writeLED(1,1)";
        document.getElementById('buttonLED'+id).value="light is on";
        //document.getElementById('buttonLED'+id).disabled = false;
    }else{
        document.getElementById('buttonLED'+id).onclick = "writeLED(1,0)";
        document.getElementById('buttonLED'+id).value="light is off";
        //document.getElementById('buttonLED'+id).disabled = false;
    }
}

好吧,只要这样做,你的问题就解决了:

document.getElementById('buttonLED'+id).setAttribute('onclick','writeLED(1,1)')

祝你有美好的一天XD

您想要这样做 - 设置一个将被执行以响应 onclick 事件的函数:

document.getElementById('buttonLED'+id).onclick = function(){ writeLED(1,1); } ;

你正在做的事情不起作用,因为:

  1. onclick 事件处理程序期望有一个函数,在这里您要分配一个字符串

    document.getElementById('buttonLED'+id).onclick = "writeLED(1,1)";
  2. 在此,您将执行 writeLED(1,1) 函数的结果分配为 ​​onclick 事件处理程序:

     document.getElementById('buttonLED'+id).onclick = writeLED(1,1);

onclick = writeLED(1,1)这行表示要立即执行函数 writeLED(arg1, arg2),参数为 1, 1 并分配返回值; 您需要创建一个将使用这些参数执行并分配它的函数。 最上面的答案给出了一个例子 - 另一个是使用 bind() 函数,如下所示:

    var writeLEDWithSpecifiedArguments = writeLED.bind(this, 1,1);
    document.getElementById('buttonLED'+id).onclick = writeLEDWithSpecifiedArguments;

使用 Jquery 而不是 Javascript,使用'attr'属性而不是'setAttribute'

喜欢

$('buttonLED'+id).attr('onclick','writeLED(1,1)')

您实际上并没有更改功能。

onClick被分配给一个函数(这是对某个东西的引用,在这种情况下是一个函数指针)。 传递给它的值无关紧要,不能以任何方式使用。

另一个问题是您的可变color似乎无处不在。

理想情况下,你应该把这个逻辑放在函数内部,让它弄清楚要写什么。 (开/关等)

另一种解决方案是将“onclick”属性设置为返回 writeLED 函数的函数。

document.getElementById('buttonLED'+id).onclick = function(){ return writeLED(1,1)};

当您在 JavaScript 中创建尚未在浏览器中绘制的元素时,这对于其他情况也很有用。

首先,我们将使用查询选择器选择所需的按钮,对于所有选定的按钮,我们将使用需要通过单击按钮调用的函数设置onclick属性。 您可以通过单击定义的函数中的按钮来编写所需工作的代码。

那么您的问题的“一个”通用解决方案可以通过以下代码实现:

var a=document.querySelectorAll('button');


for(b=0;b<a.length;b++)
   {   
        a[b].setAttribute("onclick","check("+b+")");
   }
  function check(e)
   {    
    var sa=a[e].innerHTML;
    console.log('working onclick',sa);
   }

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM