jquery 1.10并自动运行toggle事件

Question

我有一个简单的代码来点击一个按钮,并使用jquery动画颜色切换div大小和颜色,但问题是切换事件发生没有点击,按钮消失

HTML:

<input type="button" id="togglemove" value="toggle div1 move" />

<input type="button" id="toggle" value="toggle" /> 

<div class="div1"></div>

jquery:

$(document).ready(function(e) {

$("#toggle").toggle(click1,click2);
$("#togglemove").toggle(move1,move2);
    });

function move1(){
    $(".div1").animate({"left":"200px"},1000);
}

function move2(){
    $(".div1").animate({"left":"100px"},1000);
}
function click1(){
    $("div.div1").animate({"width":"400px","border-radius":"10px",'background-color': '#400101','left':'200px'},1000);
}
function click2(){
    $("div.div1").animate({"width":"200px","border-radius":"0",'background-color': '#000000','left':'100px'},1000);
}

住在jsfiddle:http://jsfiddle.net/kaNP4/

Answer 1

在jQuery 1.9版本中删除了切换的这种特殊用法,因此您需要自己实现切换功能.下面给出了一个示例实现

看到

$(document).ready(function(e) {

    $("#toggle").click(function(){
        var state = $(this).data('toggleState');
        if(state){
            click2();
        } else {
            click1();
        }
        $(this).data('toggleState', !state);
    });
    $("#togglemove").click(function(){
        var state = $(this).data('toggleState');
        if(state){
            move2();
        } else {
            move1();
        }
        $(this).data('toggleState', !state);
    });
});

演示:小提琴