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()了方法，而不是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 时，它都是正在执行的第二个函数。

你也可以这样编码：

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

我认为您错误地认为单击（例如悬停）接受不同状态的两个函数-不幸的是，没有- mouseover 和 mouseout 是明确的状态可跟踪的，但是，“交替单击”不是明确的状态可跟踪的，因此 jQuery click 没有t 提供此设施。

于 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 回答