javascript - jQuery 代码无法在 Google Chrome 上运行？

Question

此代码不适用于 google chroome，但适用于 Firefox、opera 和 IE

function show() {
    $('#networks').click(function () {
        $('#social').slideDown(1000);
        $('#face,#twitter,#google,#youtube,#rss').fadeIn(2000)
    });

    $('#networks').blur(function () {
        $('#face,#twitter,#google,#youtube,#rss').fadeOut(1000);
        $('#social').delay(1000).slideUp(1000);
    });
}

在这段代码之后的相同文档中，我编写了下面的代码，并在 google chroome 和所有其他浏览器上工作，为什么这段代码在 google chroome 中运行良好，但上面却不行？？？

function UseData() {

    $("#submit").click(function () {

        $(this).val("");
        $(this).animate({
            width: '250px',
        }, "slow")

    });

    $("#submit").blur(function () {
        $(this).val("Search");
        $(this).animate({
            width: '175px',
        }, "slow");
    });
}

谢谢

Answer 1

http://jsfiddle.net/A4CJz/10/

我相信你想要的效果是这样的:

• 当鼠标悬停在元素上(不是焦点)时，显示社交菜单
• 当鼠标离开元素(不是模糊)时，隐藏社交菜单

你的标记太糟糕了。这就是为什么它在 Chrome 中不起作用的原因。在这个解决方案发挥作用之前，您确实需要学习有效的标记和有效的 JS。特别是，您不能在列表中将 a 标记包裹在 li 标记周围。 ul 的唯一有效子级是 li。

您也不需要对每个 li 元素进行 ID 并直接定位它们。 jquery 的快速类(class)将向您展示您可以通过标签名称进行定位，您将在我发布的示例 fiddle 中看到我所做的，如下所示: $('#social li')

我还取消了内联 JS，并使用 jquery 连接 mouseenter 和 mouseleave 事件。

我建议您仔细研究代码，并尝试理解我如何以及为何按照我的方式重组您的代码。