1

私は Javascript と jQuery を使い始めたばかりなので、これが本当にばかげた質問だとしても怒らないでください。div関数をバインドして aの内容を置き換えることになってい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);
});
4

5 に答える 5

1

toggle要素を表示または非表示にし、2つの任意の状態を切り替えません(更新: @sberryがコメントで指摘したように、1.8までのバージョンで意図したとおりに動作していました)。

引数を使用して呼び出すとfunction(ドキュメントに示されているように、どちらのユースケースでも有効な引数ではありません)、引数なしで呼び出された場合と同じように動作します(つまり、非表示の場合は表示、表示されている場合は非表示) )。divは最初に表示されていたため、非表示になります。

于 2013-03-22T05:27:18.043 に答える
1

ここで説明されているように、使用しtoggle()たい関数は廃止されましたhttp://api.jquery.com/toggle-event/

show()この関数は、とを切り替える関数に置き換えられましたhide()http://api.jquery.com/toggle/

あなたが望むのは次のようなものです:

function highlight(evt){
    $('#evtTarget').toggleClass('highlighted');
}
function func_1(evt){
    $('#evtTarget').html("CLICK!!");
    $('#evtTarget').unbind('click',func_1);
    $('#evtTarget').click(func_2);
}

function func_2(evt){
    $('#evtTarget').html("CLACK!!");
    $('#evtTarget').unbind('click',func_2);
    $('#evtTarget').click(func_1);
}
$('#evtTarget').hover(highlight,highlight);
$('#evtTarget').click(func_1);
于 2013-03-22T05:38:53.260 に答える
1

トグルのドキュメントについては、次を参照してください。

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);
});

' 役に立てば幸いです。間違っている場合は修正してください。

于 2013-03-22T05:32:47.403 に答える
1

修正版はこちら: http://jsfiddle.net/NZjvJ/3/

.toggle()要素を表示/非表示にします。それはあなたが望んでいたことではないと思います。

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

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

$(function(){
    $('#evtTarget').hover(highlight,highlight);
    $('#evtTarget').click(func_1);
});
于 2013-03-22T05:33:23.323 に答える
0

あなたがやろうとしているのは、document.readyでtoggleを使用することです。toggle..非表示の場合はdivを表示し、それ以外の場合は非表示にします。 ...(非表示のdivを再度表示するためにtoggleを呼び出す他のイベントはありません)

必要なのは、クリックのようなトグルのイベント、または任意のイベントのホバーまたはキープです...。

$(function(){
   $('#someDiv').click(function(){
      $('#evtTarget').toggle(func_1,func_2);
   });
});
于 2013-03-22T05:27:47.157 に答える