javascript - 将两个功能绑定到同一个按钮

Question

执行以下操作是有效的：

<form id="legalopt">
    <button type="submit" id="confirmopt" onclick="function2();">Click ME!</button>
</form>

$('#legalopt').submit(function(e){
    e.preventDefault();
    function1();
}

如您所见，funcion1()当表单由提交按钮提交时触发，并且function2()由于按钮的调用而被onlick调用。

这是有效的吗？是否兼容跨浏览器？

Answer 1

我更喜欢，因为它们都在同时执行，

$('#legalopt').submit(function(e){
  e.preventDefault();
  function2();
  function1();
});

Answer 2

如果您想按顺序执行函数，那么最好将函数作为参数传递给要首先调用的函数。

function1(function2);
...
// At the end of function1's code
function2();

Answer 3

谁对我的回答投了反对票，这是一个小提琴

<form id="legalopt">
  <button type="submit" id="confirmopt" onclick="function1();function2();">Click ME!</button>
</form>

<div id="box"></div>


#box {
  position: absolute;
  width: 150px;
  height: 150px;
  top: 150px;
  left: 12px;
  border: 1px solid gray;
}



$(function() {

  $('#legalopt').submit(function(e) {
    e.preventDefault();
    function1();
    function2();
  });

  function function1() {
    $('#box').stop().animate({ left: '250px' }, 600);
  }
  function function2() {
    $('#box').css({ background: '#900' }).animate({ left: '12px'}, 600);
  }

});