1

这就是我所拥有的

在我的 .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 属性可以正确应用，但是每当我将鼠标悬停在按钮内外时，我都会收到以下错误“预期对象”第 11 行（IE8 其他浏览器不显示任何内容），这是"<script type="text/javascript">"开始的位置。

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

编辑答案

我做错了两件事

  1. 我使用的$(this).hover应该是$('.ui-button').hover，我最初使用的是$(".ui-button").hover注意双引号！

  2. 在我的 .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>
4

3 回答 3

3

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

$(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() {
于 2009-07-17T16:42:27.830 回答
1

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

另外，请确保您在上面的某个地方包含了 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");
        });
});
于 2009-07-17T16:42:00.343 回答
1

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

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

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

于 2009-07-17T16:49:07.550 回答