Question

我对jQuery有点新鲜，跟我一样！我想要做的是当我在一个div容器（#links）中时，我希望能够将鼠标悬停在链接上，然后执行一个动作（稍后会被暗示）。当我退出div框（#links）时，我想要进行不同的操作。

问题：将鼠标悬停在div容器（#links）中。当我转到点击链接时，它会按要求记录属性。但是，当我离开div容器（#links）并返回时，单击链接而不是显示单个日志事件。下次我这样做，它会显示3次，4次等...

html：

<div id="links">
    <ul>
        <li><a href="javascript:void(0)" name="link_1" >link 1</a></li>
        <li><a href="javascript:void(0)" name="link_2" >link 2</a></li>
        <li><a href="javascript:void(0)" name="link_3" >link 3</a></li>
        <li><a href="javascript:void(0)" name="link_4" >link 4</a></li>
        <li><a href="javascript:void(0)" name="link_5" >link 5</a></li>
    </ul>
    </div>

JS：

var jQ = jQuery.noConflict();
        jQ(document).ready(function()
        {

                jQ("#links").hover(
                    function() {
                        console.log("links over")
                        jQ("a").click(function() {
                            console.log(this)
                        })
                    },
                    function() {
                        console.log("links out")
                    }
                );
        });

控制台： note ::所有“a”属性都是 SINGLE 点击的结果。

链接

a name =“link_5”href =“javascript：void（0）”

链接

a name =“link_5”href =“javascript：void（0）”

链接

Answer 1

请勿在{{1}}内定义$.click()方法。每次悬停时，您都会在点击中添加另一个事件：

$.hover();

应该从jQ("a").click(function() { console.log(this) })来电中提取。

$.hover()

Answer 2

感谢您的反馈。我来自c ++背景，所以我可以看到我有点困惑。

也许是因为没有像我原来那样具体而是我的错。当你将鼠标悬停在某个链接上时，我希望创建一个交换效果（我知道我将click事件放在那里，但它会被更改为悬停）。所以：

当鼠标进入#links时，我想让它创建一个bool 如果它在那里是假的，那就是真的离开了。
如果鼠标是：
交换当前加载的图像要加载的新图像：
交换当前加载的图片超出默认图像。

我已经创造了一些有效的东西，但它仍然存在我手头面临的问题。你们解释了哪些

    var jQ = jQuery.noConflict();
jQ(document).ready(function()
{
    jQ('#links').hover(
        // over
        function() 
        {
            mseOver();
        },

        // out
        function() 
        {
            mseOut();
        }
    );

    function mseOver()
    {
        jQ('#links li a').hover(function() {
            var img = jQ(this).attr("name");

            jQ("#image_swap").fadeOut("medium", function() {
                jQ(this).attr("src", img);
                jQ(this).fadeIn("medium");
            });
        });
    }

    function mseOut()
    {
            jQ("#image_swap").attr("src", "images/default.jpg")
    }

jQuery重复的对象

2 个答案: