jquery - 迷你jQuery脚本使div消失，而不是替换其内容

我刚刚开始使用Javascript和jQuery，所以如果这是一个愚蠢的问题，请不要生气。我们应该通过绑定div函数来替换toggle的内容，但是当我运行它时，整个div都会“缩小”。我究竟做错了什么？迷你脚本是

function highlight(evt){
    $('#evtTarget').toggleClass('highlighted');
}

function func_1(evt){
    $('#evtTarget').html("CLICK!!");
}

function func_2(evt){
    $('#evtTarget').html("CLACK!!");
}

$(function(){
    $('#evtTarget').hover(highlight,highlight);
    $('#evtTarget').toggle(func_1,func_2);
});

最佳答案

请参阅此以获取切换文档：

http://api.jquery.com/toggle/

如果要替换悬停内容..，则应使用以下代码替换行；

function onhover(evt){
 $('#evtTarget').toggleClass('highlighted');
$('#evtTarget').html("hover in!!");
}


function onhoverout(evt){
 $('#evtTarget').toggleClass('highlighted');
$('#evtTarget').html("hover out!!");
}

$(function(){
    $('#evtTarget').hover(onhover,onhoverout);
//below toggle is not suggested to use like this.
    $('#evtTarget').toggle(func_1,func_2);
});

'
希望它对我有帮助。