JavaScript 到 jQuery 语法 仍然需要转换方面的帮助

Question

我无法找出运行时出了什么问题。 在这里，我尝试将 JavaScript 重写为 jQuery 语法。 究竟什么是不正确的？我做错了什么。

旧版>>

var cssmenuids = ["navmenu"];

    function createcssmenu()
    {
        for (var i = 0; i < cssmenuids.length; i++)
             var ultags = document.getElementById(cssmenuids[i]).getElementsByTagName("ul");
            for (var t = 0; t < ultags.length; t++)
            {
                ultags[t].style.top = ultags[t].parentNode.offsetHeight + "-1px";
                ultags[t].parentNode.onmouseover = function()
                {
                    this.style.zIndex = 100;
                    this.getElementsByTagName("ul")[0].style.visibility = "visible";
                    this.getElementsByTagName("ul")[0].style.zIndex = 0;
                }
                ultags[t].parentNode.onmouseout = function()
                {
                    this.style.zIndex = 0;
                    this.getElementsByTagName("ul")[0].style.visibility = "hidden";
                    this.getElementsByTagName("ul")[0].style.zIndex = 100;
                }
            }
        }
    }

    if (window.addEventListener)
        window.addEventListener("load", createcssmenu, false);
    else if (window.attachEvent)
        window.attachEvent("onload", createcssmenu);

jQuery 语法 >>

    $(document).ready(function ()
    {
        $('ul#navmenu').height = $('ul#navmenu').parent.height + "-1px";

        $('ul#navmenu').parent.bind('mouseover', function ()
        {
            $(this).css('z-index', 100);
            $(this).$('ul')[0].css("visibility", "visible");
            $(this).$('ul')[0].css('z-index', 0);
        });
        $('ul#navmenu').parent.bind('mouseout', function ()
        {
            $(this).css('z-index', 0);
            $(this).$('ul')[0].css("visibility", "hidden");
            $(this).$('ul')[0].css('z-index', 100);
        });
    });

JSfiddle 上就是这样 http://jsfiddle.net/sublay/HCajr/

相关问题JavaScript to jQuery syntax Building custom CSS horizontal menu

Answer 1

您的大多数调用都缺少括号。

声明高度应该如下所示

$('ul#navmenu').height($('ul#navmenu').parent().height() -1)

您需要使用.parent()而不是.parent

$('ul#navmenu').parent().bind('mouseover'

下面，您似乎正在尝试在#navmenu 中首先使用第一个可用的ul。当您使用 [0] 时，您实际上是在调用 .get() ，它将 jQuery 对象转换为 javascript DOM 元素。这样做将消除您对其运行 jQuery 函数的能力。此外，对于选择器来说，链接不会像这样发生。此外，.css() 将接受带有键:值对的对象。

$(this).find('ul:first').css({
    "visibility" : "visible",
    "z-index" : 0
});

再次缺少 () 的 .parent()

$('ul#navmenu').parent().bind('mouseout',

再说一遍，选择器链是错误的。

$(this).find('ul:first').css({
    "visibility" : "hidden",
    'z-index' : 100
});