用jQuery更改按钮的function？

这可能是一个愚蠢的问题，但我无法做到这一点。 我可以使用普通的JavaScript更改按钮的function，但不能使用jQuery。 我的目标是一个非常简单的文本resize按钮。 这个按钮需要两个不同的function; 一个使文本变大并将click函数更改为另一个函数，另一个函数使文本变小并再次将click函数更改为第一个函数。 由于相同的按钮将用于放大和缩小文本sixe，我需要这个工作。 我正在研究一个学校项目，我们只需要使用jQuery / jQuery UI来完成这项任务。

使用普通的JavaScript，它将是这样的：

var button = document.getElementById('click-button'); button.onclick = firstClick; function firstClick (){ button.onclick=secondClick; } function secondClick(){ button.onclick=firstClick; } 

如何使用jQuery实现相同的function？

Answer 1

像下面的代码一样会起作用。

 $("#click-button").on('click', firstClick) function firstClick() { alert("First Clicked"); $("#click-button").off('click').on('click', secondClick) } function secondClick() { alert("Second Clicked"); $("#click-button").off('click').on('click', firstClick) } 

这里的工作示例： http ： //jsfiddle.net/K3Xk4/

Answer 2

您不需要每次都更改处理程序。 您可以使用函数和变量来检查是否已经单击了按钮（或不是）。

 var even = false; $('#click-button').click(function() { if(even) { doEven(); } else { doOdd(); } even = !even; }); function doOdd() { // first click, third click, fifth click, etc } function doEven() { // second click, fourth click, sixth click, etc } 

Answer 3

你可以这样做

 test var flag = 1; $("#click-button").click(function(){ if(flag == 2){ secondClick(); flag = 1; }else{ firstClick(); flag = 2; } }); function firstClick(){ alert("First Click."); } function secondClick(){ alert("Second Click.") } 

点击这里http://jsfiddle.net/K3Xk4/5/

Answer 4

我会使用自定义事件和数据处理：

 $('#click-button').on({ firstClick : function() { // do something alert(111); // switch back $(this).data('nextClick', 'secondClick'); }, secondClick : function() { // do something alert(222); // switch back $(this).data('nextClick', 'firstClick'); }, click : function() { var nextClick = $(this).data('nextClick') || 'firstClick'; $(this).trigger( nextClick ); } }); 

示例： http ： //jsfiddle.net/psycketom/nbSMg/

您始终使用相同的元素范围，无需在函数外部定义变量。

可能有点矫枉过正，但最容易维护。