Question

我的html代码中有两个按钮。我想为每个按钮只调用一个js函数（没有jQuery）。

该功能将具备条件。我想知道如何比较用户点击的按钮。

示例：

＆＃13;

if (button 1 clicked) {
  block
} else {
  block
}

＆＃13;

另一种方法是每个按钮创建一个功能，但我不想这样做。

非常感谢。

Answer 1

正如评论中所述，添加参数this以通过获取其ID来了解点击了哪个按钮。

function myFunction(elem) { 
    document.getElementById("demo").innerHTML = "ID:" + elem.id; 
}

<button id='1' onclick="myFunction(this)">button 1</button>
<button id='2' onclick="myFunction(this)">button 2</button>

<p id="demo"></p>

Answer 2

将@Dyrandz Famador的答案扩展到您想要的问题中（请接受他/她的回答）：

function myFunction(elem) { 
    switch(elem.id) {
       case '1':
       ... your code
       break;
       case '2':
       ... your code
       break;
    }
}

<button id='1' onclick="myFunction(this)">button 1</button>
<button id='2' onclick="myFunction(this)">button 2</button>

Answer 3

喜欢这个吗？

＆＃13;

.state('app.usermng', {
          url: '/usermng',
          templateUrl: 'tpl/app_usermng.html',
          abstract: true,
          resolve: {
              deps: ['uiLoad',
                function( uiLoad ){
                  return uiLoad.load( ['js/controllers/usermng/usermng.js','css/usermng.css'] );
              }]
          },
          onEnter: function(){
            console.log("enter usermng");
          }
      })
      .state('app.usermng.table',{
          url:'/table',
          templateUrl:'tpl/app_usermng_table.html',
          resolve:{
            deps:[
                'uiload',
                function(uiload){
                  return uiload.load(['js/controllers/usermng/usermngtable.js'])
                }
            ]
          },
          onEnter: function(){
            console.log("enter usermng table");
          }

      })

＆＃13;

function handler(el){
buttons[i].addEventListener('click',function(e){
if(e.target.innerHTML=='Button1'){
alert("I will execute everything when button1 is clicked")
}
if(e.target.innerHTML=='Button2'){
alert("I will execute everything when button2 is clicked")
}
if(e.target.innerHTML=='Button3'){
alert("I will execute everything when button3 is clicked")
}

},false)
}
var buttons=document.getElementsByTagName('button')
for(i=0;i<buttons.length;++i){
handler(i)
}

＆＃13;

Answer 4

您可以使用this关键字执行此操作。 this会点击您点击的内容。

$(document).ready(function(){
    $("button").click(function(){
    console.log();
    alert(this.innerHTML + " Clicked");
  })
});

<强> Working fiddle

如何比较js中的两个或更多按钮？

4 个答案: