asp.net JQuery .hover 事件给出“预期对象”错误答案

【问题标题】：asp.net JQuery .hover event gives out "object expected" errorasp.net JQuery .hover 事件给出“预期对象”错误
【发布时间】：2009-07-17 16:40:10
【问题描述】：

这就是我所拥有的

在我的 .master 页面上，我有以下内容

<script type="text/javascript">
$(document).ready(function() {
    $(this).hover(function() {
        $(this).addClass("ui-state-hover");
    },
        function() {
            $(this).removeClass("ui-state-hover");
        }
    ).mousedown(function() {
        $(this).addClass("ui-state-active");
    })
    .mouseup(function() {
        $(this).removeClass("ui-state-active");
    });
});

我的asp.net按钮声明如下

<asp:button runat="server" id="cmdSubmitShipmentRequest" cssclass="ui-button ui-state-default ui-corner-all" text="Submit" />

预期的行为是，只要鼠标指针悬停在任何按钮内外，就会添加和删除上述声明的 css 类。目前，默认的 css 属性可以正确应用，但是每当我将鼠标悬停在按钮内外时，我都会收到以下错误“Object Expected”第 11 行（IE8 其他浏览器不显示任何内容），这是 "<script type="text/javascript">" 开始的位置。

关于我可能做错了什么的任何线索？

修改答案

我做错了两件事

我使用 $(this).hover 应该是 $('.ui-button').hover 我最初使用但我输入的它是 $(".ui-button").hover 注意双引号！
在我的 .master 页面上，我使用 asp.net javascript 管理器声明我的 javascript，如下所示

问题是我的 javascript 代码块下面有脚本声明！。

最后这就是 javascript 和代码块的样子，一切都按预期运行。

<asp:scriptmanager id="scriptManager" runat="server">
    <scripts>
        <asp:scriptreference path="~/javascript/jquery-1.3.2.min.js" />
        <asp:scriptreference path="~/javascript/jquery-ui-1.7.2.custom.min.js" />
        <asp:scriptreference path="~/Javascript/thickbox.js" />
    </scripts>
</asp:scriptmanager>

 <script type="text/javascript">
     $(document).ready(function() {
         $('.ui-button').hover(function() {
             $(this).addClass("ui-state-hover");
         },
            function() {
                $(this).removeClass("ui-state-hover");
            }
        ).mousedown(function() {
            $(this).addClass("ui-state-active");
        })
        .mouseup(function() {
            $(this).removeClass("ui-state-active");
        });
     });
</script>

【问题讨论】：

$(this).hover(...)。在这种情况下这是什么？您是否尝试将其仅应用于按钮或文档？错字？

标签： asp.net jquery hover

【解决方案1】：

尝试将您的代码更改为此....

$(document).ready(function() {
    //SELECT THE .ui-button CLASS INSTEAD OF this
    $('.ui-button').hover(function() {
        $(this).addClass("ui-state-hover");
    },
                function() {
                    $(this).removeClass("ui-state-hover");
                }
        ).mousedown(function() {
            $(this).addClass("ui-state-active");
        })
        .mouseup(function() {
            $(this).removeClass("ui-state-active");
        });
});

我不相信“this”具有您在使用这行代码时所针对的上下文...

$(this).hover(function() {

尝试将上面的行替换为以下内容...

$('.ui-button').hover(function() {

【讨论】：

我过去使用过“ui-button”，但我使用的是双引号而不是单引号！我的 jquery 声明上方也有上述 JavaScript 代码，也感谢您的及时回复
双引号也可以，这里的关键是 .在“.ui-button”上

【解决方案2】：

这会给你更多你想要的吗？

另外，请确保您在上面的某个位置包含 jquery 库。

$(document).ready(function() {
    $('.ui-button').hover(function() {
        $(this).addClass("ui-state-hover");
    },
                function() {
                    $(this).removeClass("ui-state-hover");
                }
        ).mousedown(function() {
            $(this).addClass("ui-state-active");
        })
        .mouseup(function() {
            $(this).removeClass("ui-state-active");
        });
});

【讨论】：

【解决方案3】：

在您当前的代码 sn-p 中，$(this) 指的是 $(document)。试试这个：

$(document).ready(function() {  
    $('.ui-button').hover(function() {  
        $(this).addClass("ui-state-hover");  
    }, <rest of code omitted>
}

现在 $(this) 指的是 $('.ui-button')，这就是你想要的。

【讨论】：