asp.net jQuery .hover事件给出了“对象预期”错误 [英] asp.net JQuery .hover event gives out "object expected" error

问题描述

这是我的

在我的.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 =serverid =cmdSubmitShipmentRequestcssclass =ui-button ui -state-default ui-corner-alltext =提交/> 
  

预期的行为是任何时候鼠标指针悬停进出任何按钮时，上面声明的css类被添加和删除。目前，默认的CSS属性应用正常，但任何时候我悬停进出一个按钮我得到以下错误对象预期第11行（IE8其他浏览器不显示任何内容），这是 < script type =text / javascript>开始。

我可能做错了什么？ p>

编辑答案

---

我做了两件事情错误
$ b $（<。ui-button'）。hover $ b

1. strong>这是我最初的，但我输入它为 $（。ui-button）。hover 注意双引号！

p>在我的.master页面上，我使用asp.net javascript管理器声明我的javascript如下













问题在于我的脚本声明在我的javascript代码下面方框！





最后，这是javascript和代码块的外观，并且所有的功能都可以正常运行。

 < asp：scriptmanager id =scriptManagerrunat =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 ）; 
}，
 function（）{
 $（this）.removeClass（ui-state-hover）; 
} 
）。 mousedown（function（）{
 $（this）.addClass（ui-state-active）; 
}）
 .mouseup（function（）{
 $（this ）.removeClass（ui-state-active）; 
}）; 
}）; 
< / script> 
  




解决方案

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

  $（document）.ready（function（）{
 //选择.ui-按钮CLASS INSTEAD OF this 
 $（'。ui-button'）。hover（function（）{
 $（this）.addClass（ui-state-hover）; 
}，
函数（）{
 $（this）.removeClass（ui-state-hover）; 
} 
）.mousedown（function（）{
 $（this）。 addClass（ui-state-active）; 
}）
 .mouseup（function（）{
 $（this）.removeClass（ui-state-active）; 
}）; 
}）; 
  

我不相信this具有您在使用此行时定位的上下文代码...

  $（this）.hover（function（）{
  
 <$ c 
 $ c $（'。ui-button'）。hover（function（）{
  
 
This is what I have

On my .master page i have the following
<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");
    });
});


and my asp.net buttons are declared as follows
<asp:button runat="server" id="cmdSubmitShipmentRequest" cssclass="ui-button ui-state-default ui-corner-all" text="Submit" />
The expected behavior is that any time the mouse pointer hovers in and out of any button the above declared css classes are added and removed. Currently the default css properties apply properly but any time I hover in and out of a button I get the following error "Object Expected" Line 11 (IE8 other browsers display nothing), which is the position where the "<script type="text/javascript">" begins.

any clue as to what I may be doing wrong?

EDIT WITH ANSWER

I was doing two things wrong

I was using $(this).hover should of been $('.ui-button').hover which I had initially but  I typed it as $(".ui-button").hover NOTICE THE DOUBLE QUOTES!
On my .master page I am declaring my javascript using the asp.net javascript manager as follows


    
        
        
        
    

the problem was that I had the script declarations below my javascript code block!.

In the end this is what the javascript and code block look like and all works well as expected.
<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> 

解决方案
Try changing your code to this....
$(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");
        });
});
I do not believe that "this" has the context that you were targeting when you use this line of code...
$(this).hover(function() {
Try replacing the line above with the following...
$('.ui-button').hover(function() {


                        
这篇关于asp.net jQuery .hover事件给出了“对象预期”错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！