0

此代码不适用于 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");
    });
}

谢谢

4

2 回答 2

2

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

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

  • 当鼠标悬停在元素上时（不是focus）然后显示社交菜单
  • 当鼠标离开元素（不是blur）然后隐藏社交菜单

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

您也不需要标识每个li元素并直接定位它们。jquery 中的快速课程将向您展示您可以按标签名称定位，您将在我发布的示例小提琴中看到我这样做，如下所示：$('#social li')

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

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

于 2013-06-15T14:16:49.540 回答
1

好的，首先你的小提琴取决于jQuery所以你必须包括它。第二件事是您必须将脚本加载到代码中head才能使用inline。（onclick-tags 上的html-handlers）。否则你function的 ' 将是未定义的 ;-)

但是要指出你真正的问题是什么，没有什么特别需要的。a-tag 不能处理focus或-events blur。

你可以在这里阅读更多：http: //api.jquery.com/focus/#entry-longdesc

工作小提琴：

http://fiddle.jshell.net/A4CJz/3/

另一个提示，防止您附加的默认操作event，以终止其正常行为。只需preventDefault在event-object 上或return false在事件处理程序函数的末尾简单地完成。

更新

http://fiddle.jshell.net/A4CJz/12/

于 2013-06-15T14:07:41.580 回答