jquery - Jquery Toggle 两个功能在 1.10.1 中不起作用

Question

Jquery Toggle 两个功能在 jquery 1.10.1 中不起作用，但在 Jquery 1.8.3 中起作用

HTML

<p>For example, consider the HTML:</p>
                <div id="target">
                  Click here
                </div>

jQuery

$('#target').toggle(function() {
    alert('First handler for .toggle() called.');
}, function() {
    alert('Second handler for .toggle() called.');
});

示例在这里

Answer 1

老兄，它在 jQuery 1.10.1 中不起作用

还有另一种方法可以做到这一点......

$(function () {
    function first() {
       //Code for first time click goes here
        $(this).one("click", second);
    }
    function second() {
        //Code for second time click goes here
        $(this).one("click", first);
    }
    $("#target").one("click", first);
});

Answer 2

jQuery.toggle自 1.8 版以来已被弃用，并在稍后的某个时间被删除。您可以编写自己的实现：

function handler1() {
    alert("first handler for .toggle() called.");
    $(this).one("click", handler2);
}
function handler2() {
    alert("second handler for .toggle() called.");
    $(this).one("click", handler1);
}
$("#target").one("click", handler1);

演示

Answer 3

演示

演示 jQuery 2.x（边缘）

使用此clickToggle插件作为toggle功能已从 1.9 版中删除

(function ($) {
    $.fn.clickToggle = function (func1, func2) {
        var funcs = [func1, func2];
        this.data('toggleclicked', 0);
        this.click(function () {
            var data = $(this).data();
            var tc = data.toggleclicked;
            $.proxy(funcs[tc], this)();
            data.toggleclicked = (tc + 1) % 2;
        });
        return this;
    };
}(jQuery));
$('#target').clickToggle(function () {
    alert('First handler for .toggle() called.');
}, function () {
    alert('Second handler for .toggle() called.');
});

Answer 4

此格式在 1.9 版中已删除，因此您无法使用它 - 如果您希望此逻辑可以手动实现，或者您可以使用迁移插件

要包含迁移插件，在包含 jQuery 库后添加

<script src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script>

Answer 5

这是一个通用方法，具有多个切换功能：

var toggleFunctions = [
    function () { /* do something */},
    function () { /* do something else */},
    ...
    function () { /* do some other stuff*/}
];

$("#target").on("click", function(){
    // returns first function from array
    var currentFunction = toggleFunctions.shift(); 
    // executes the function
    currentFunction(); 
    // pushes current function to the back
    toggleFunctions [] = currentFunction; 
});

Answer 6

它在 jQuery 1.9 中被删除：

这是 .toggle() 的“单击元素以运行指定的函数”签名。它不应该与 .toggle() 的“更改元素的可见性”相混淆，后者未被弃用。前者被删除以减少混淆并提高库中模块化的潜力。jQuery Migrate 插件可用于恢复功能。

完整的升级指南：http: //jquery.com/upgrade-guide/1.9/

Answer 7

在 jquery 中切换对我不起作用，所以在 stackoverflow 的帮助下，我的替代方法是

<a href="#" id="thiclik"> Click Me To Change</a>
		
		<div id="clickevent">
		</div>

这是实现，或者您可以说切换功能的替代方案

$('#thiclik').click(function()
{
//toggle alternative 

	function handler1() {
		//alert("first handler for .toggle() called.");
		$("#clickevent").text("Yes");
		$('#thiclik').one("click", handler2);
	}
	function handler2() {
	//	alert("second handler for .toggle() called.");
		$("#clickevent").text("No");
		$('#thiclik').one("click", handler1);
	}
	$("#thiclik").one("click", handler1);
});

为我工作，但当我第一次点击点击我时没有什么问题，但第二次和第三次它工作正常。