1

JqueryのハイパーリンクのonclickでHTMlの特定のdivを表示するために、この点に固執しました。次のコードを試しましたが、答えが得られませんでした。

$(function() {
    var moveLeft = 20;
    var moveDown = 10;

    $('a#trigger').click(function(e) {
        $('div#pop-up').show()
            .css('top', e.pageY + moveDown)
            .css('left', e.pageX + moveLeft)
            .appendTo('body');
        }, function() {
            $('div#pop-up').hide();
    });
    $('a#trigger').mousemove(function(e) {
        $("div#pop-up").css('top', e.pageY + moveDown).css('left', e.pageX + moveLeft);
    });
});

hover()ここで、 methodの代わりにmethodを試しclick()ましたが、置くclick()と機能しますが、機能するにはメソッドが必要click()です。どうすればそれを達成できますか? 助けてください...

4

2 に答える 2

2

UNLIKE hover() であるため、click() メソッドは単一のハンドラーのみをサポートします。
これを参照してください: http://api.jquery.com/click/

したがって、あなたの場合、コードフラグメントに注意してください：

                $('a#trigger').click(function(e) {
                    $('div#pop-up').show()
                    .css('top', e.pageY + moveDown)
                    .css('left', e.pageX + moveLeft)
                    .appendTo('body');
                }, function() {
                    $('div#pop-up').hide();
                });

クリック時に実行する最初の関数は、実際には意味のないイベント データとして渡されています。#trigger をクリックするたびに、実行されるのは 2 番目の関数です。

または、次のようにコーディングすることもできます。

var triggerState = 0;
$('a#trigger').click(function(e) {
    if (triggerState === 0) {
        $('div#pop-up').show()
        .css('top', e.pageY + moveDown)
        .css('left', e.pageX + moveLeft)
        .appendTo('body');
        triggerState = 1;
    }
    else if (triggerState === 1) {
        $('div#pop-up').hide();
        triggerState = 0;
    }
});

クリックは、ホバーのように、異なる状態の 2 つの関数を受け入れると考えて間違いを犯したと思います。この機能を提供します。

于 2013-03-11T09:59:06.257 に答える
0

これを試して：

$(function() {
    var moveLeft = 20;
    var moveDown = 10;

    $('a#trigger').click(function(e) {

        if($('div#pop-up').length)
        {
            $('div#pop-up').toggle();
        }
        else
        {
             $('div#pop-up')
                .css({'top': e.pageY + moveDown,'left': e.pageX + moveLeft})
                .appendTo('body').show();
        }
    });

    $('a#trigger').mousemove(function(e) {
        $("div#pop-up").css({'top': e.pageY + moveDown,'left': e.pageX + moveLeft});
    });
});
于 2013-03-11T09:54:11.177 に答える