Question

我的html代码中有很多看起来像这样的按钮

<li>
        <span class="avatar"><span class="status online"></span></span>
        <spa">

这是myFunction（）的javascript函数

var buttonState = 0;

function myFunction(){
    cons
        buttonState = 1;
        return;
    }
    if(buttonState == 1){
        buttonState = 0;
    }
}

由于我有多个按钮，我不能只做onclick =＆＃34; myFunction（）＆＃34;对于他们所有人，因为没有办法告诉按钮的ID，他们都是ID＆＃34; addFriend＆＃34;所以myFunction（）将始终默认为第一个按钮。必须有一种方法可以解决这个问题，但我已经研究过它，没有任何好的帮助指南。有人有建议吗？

谢谢！

Answer 1

添加＆＃34;此＆＃34;在括号内：

<li>
    <span class="avatar"><span class="status online"></span></span>
    <span class="username">Barack Brobama</span>
    <input type="button" id="addFriend" onclick="myFunction(this)" class="submit" value="+ Add friend">

现在这样做：

function myFunction(pObject){
  console.log(buttonState);
  if(buttonState == 0){
    pObject.value = 'Friend Request Pending';
    buttonState = 1;
    return;
  }
  if(buttonState == 1){
    pObject.value = '+ Add Friend';
    buttonState = 0;
  }
}

Answer 2

将此用于功能

的onclick =＆＃34; myFunction的（本）＆＃34;

那么你的功能将是

   function myFunction(pObject){          
      console.log(pObject.getAttribute('state'));
      if(pObject.getAttribute('state') == '1'){
        pObject.value = '+ Add Friend';
        pObject.setAttribute('state', '0');
      }else{
        pObject.value = 'Friend Request Pending';
        pObject.setAttribute('state', '1');
      }
    }

并且你可以保存在标签中

JavaScript onclick方法，将其附加到所有按钮

2 个答案: