带有按钮的 javascript 条件

问题描述 投票:0回答:5

我在 javascript 中有两个按钮,我需要一个条件来检查按下了哪个按钮。我在网上看到了一些例子,但它不起作用。有谁知道请帮助我并纠正我吗?

if(sx.clicked == true){
// dx.style.backgroundColor = colori[random];
alert("sx");
}

if(dx.clicked == true){
alert("dx");
}
javascript button if-statement conditional-statements click
5个回答
0
投票

你不会那样做的。您应该定义一个“click”事件 - 使用“onclick”html 属性,或者使用 JS - element.onclick 或 addEventListener。

这些方式定义了当用户单击某个元素时,将执行一个函数。您定义 2 个功能,每个按钮一个。您可以在此处阅读有关 onclick 属性和 element.onclick 的信息:http://www.w3schools.com/jsref/event_onclick.asp,以及在此处了解有关 addEventListener 的信息:https://developer.mozilla.org/en-US/文档/Web/API/EventTarget.addEventListener.


0
投票

您可以尝试以下代码:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<button onclick="buttonsHandler(this)">Button1</button>
<button onclick="buttonsHandler(this)">Button2</button>

<script type="text/javascript">
    function buttonsHandler(evt)
    {
        if(evt.textContent == "Button1")
        {alert("Button1 Clicked");}

        else if(evt.textContent == "Button2")
        {alert("Button2 Clicked");}
    }
</script>

</body>
</html>

0
投票
var elements = document.getElementsByTagName('a');
   for(var i = 0, len = elements.length; i < len; i++) {
      elements[i].onclick = function () {
        alert(this.id);
   }
}

这是一个小提琴http://jsfiddle.net/9PvU5/


0
投票

将事件添加到按钮而不是特定按钮并不是一个好的做法。但有时如果你有两个/三个组合按钮,你可以尝试一下。

<button onclick="buttonsClick(this)" data-attr="btn1">Button1</button>
<button onclick="buttonsClick(this)" data-attr="btn2">Button2</button>

<script type="text/javascript">
function buttonsClick(btn)
{
    if(btn.getAttribute('data-attr') === "btn1")
    {console.log("Button1 Clicked");}
    else if(btn.getAttribute('data-attr') === "btn2")
    {console.log("Button2 Clicked");}
}
</script>

0
投票

这可能是最接近您尝试使用的方法,但使用正确的 Javascript:

<html>
  <head>
    <script>
      var button1 = document.getElementsByTagName("button")[0];
      var button2 = document.getElementsByTagName("button")[1];

      button1.onclick = function() { /*execute some code here*/ };
      button2.onclick = function() { /*execute some code here*/ };
    </script>
  </head>
  <body>
    <button>Button 1</button>
    <button>Button 2</button>
  </body>
</html>
© www.soinside.com 2019 - 2024. All rights reserved.