javascript - 点击和更改处理程序同时在Chrome上触发

我为按钮附加了两个具有相同ID的功能：

第一个功能：

$('input:radio[name=phoneSelect]').click(function() {
    console.log('First function now');
});

第二功能：

$('input:radio[name=phoneSelect]').change(function() {
    console.log('Second function now');
});

在safari上，它的工作原理非常好，当我第一次单击时，只能在Chrome上看到第一个日志，但是当我单击按钮时，两个日志都会立即显示。

我需要在第一次单击时显示第一个日志，但是当您在第二次日志上进行第二次或更多次单击时，将显示该日志。

最佳答案

请查看下面的代码片段。可能会对您有所帮助。

$('div.selectButtons span').click(function() {
    if($(this).data("alreadyClicked") == null)
    {
      alert("First function now");
      $(this).data("alreadyClicked", "true")
    }
    else
    {
      alert("Second function now");
    }

});

input[type="radio"]{
  display:none;
  }
span{
  width:30px;
  height:20px;
  border: solid 1px blue;

  }

.selectButtons{
  margin-bottom: 10px;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="selectButtons">
  <input type="radio" name="phoneSelect" ></input>
  <span>Select</span>
</div>
<div class="selectButtons">
  <input type="radio" name="phoneSelect" ></input>
  <span>Select</span>
</div>
<div class="selectButtons">
  <input type="radio" name="phoneSelect" ></input>
  <span>Select</span>
</div>