Windows.event не определен - ошибка Javascript в firefox

Я использую javascript, чтобы изменить некоторые настройки кнопки asp при наведении курсора мыши. Он работает в IE. Но не работает в Firefox. Есть ли другой код javascript, который будет поддерживать почти все браузеры? Мой код выглядит следующим образом

<script type="text/javascript">
        var previousColor;
        function Changecolor() {
            previousColor = window.event.srcElement.style.backgroundColor;
            window.event.srcElement.style.backgroundColor = "Blue";
            window.event.srcElement.style.cursor = "hand";
        }
        function RestoreColor() {
            window.event.srcElement.style.backgroundColor = previousColor;
        }
</script>


<asp:Button ID="btnSearch" runat="server" BackColor="#800000" Font-Bold="True" Font-Names="Arial" onmouseover="Changecolor();" onmouseout="RestoreColor();" ForeColor="White" Height="28px" OnClick="btnSearch_Click2" Text="Search Jobz" Width="117px" />

javascript asp.net onmouseover
person Developer404    schedule 22.01.2010    source источник
comment
Почему ты все усложняешь? Просто используйте CSS.   -  person ZippyV    schedule 22.01.2010
comment
Действительно, CSS лучше подходит для таких вещей, хотя :hover не будет работать в IE6 без что бы то ни было :наведите   -  person Andy E    schedule 22.01.2010

Ответы (4)


arrow_upward
8
arrow_downward

Ознакомьтесь с документацией Центра разработчиков Mozilla по событиям. В Internet Explorer глобальный объект события создается при запуске события. В браузерах, совместимых со стандартами, объект события передается в качестве первого аргумента функции, назначенной событию срабатывания. Если ваше событие определено в HTML, объект события создается под именем переменной event и может быть передан вызываемым вами функциям.

Также обратите внимание, что свойство event.srcElement предназначено только для IE, а большинство других браузеров вместо него используют event.target.

Принимая это во внимание, ваша функция должна выглядеть так:

<script>
        var previousColor; 
        function Changecolor(evt) {
            var srcEl = evt.srcElement || evt.target;
            previousColor = srcEl.style.backgroundColor; 
            srcEl.style.backgroundColor = "Blue"; 
            srcEl.style.cursor = "pointer"; 
        } 
        function RestoreColor(evt) {
            var srcEl = evt.srcElement || evt.target;
            srcEl.style.backgroundColor = previousColor; 
        } 
</script> 


<asp:Button ID="btnSearch" runat="server" BackColor="#800000" Font-Bold="True" Font-Names="Arial" onmouseover="Changecolor(event);" onmouseout="RestoreColor(event);" ForeColor="White" Height="28px" OnClick="btnSearch_Click2" Text="Search Jobz" Width="117px" />
person Andy E    schedule 22.01.2010
comment
Спасибо! Он работает.. Но курсор не работает.. Я не вижу символ руки ни в Google Chrome, ни в Firefox. - person Developer404; 22.01.2010
comment
Хорошо.. Я использовал указатель вместо руки.. Теперь это работает для меня :-) Большое спасибо... - person Developer404; 22.01.2010
comment
Ах, ты меня опередил. Рад, что смог помочь. - person Andy E; 22.01.2010

arrow_upward
1
arrow_downward

Почему бы вам не использовать CSS (с его псевдоклассом :hover) вместо JS?

Но если вам по каким-то причинам нужно использовать JS, просто передайте ссылку на элемент как параметр функции:

function Cangecolor(ref){
  prevousColor = ref.style....;

...

onmouseover="changecolor(this)"

Прямо сейчас ваш код не работает, потому что IE использует другую модель событий (хорошие браузеры используют модель событий W3C, но IE использует свою собственную). Вы можете прочитать о моделях событий W3C/IE по адресу: Как уравнять модели событий IE и W3C]

person Crozin    schedule 22.01.2010
comment
Псевдокласс :hover не работает с элементами, отличными от <a> в IE 6. - person Tim Down; 22.01.2010
comment
Если вам нужен IE6, используйте что угодно: наведите указатель мыши или, что еще лучше, IE8.js - person Crozin; 22.01.2010

arrow_upward
1
arrow_downward

Вам не нужно возиться с объектом события. Кроме того, правильным значением свойства CSS курсора является «указатель», а не специфичная для IE «рука», если только вам не требуется поддержка IE 5 или 5.5.

<script type="text/javascript">
        var previousColor;

        function changeColor(el) {
            var s = el.style;
            previousColor = s.backgroundColor;
            s.backgroundColor = "Blue";
            s.cursor = "pointer";
        }
        function restoreColor(el) {
            el.style.backgroundColor = previousColor;
        }
</script>


<asp:Button ID="btnSearch" runat="server" BackColor="#800000"
    Font-Bold="True" Font-Names="Arial"
    onmouseover="changeColor(this);" onmouseout="restoreColor(this);"
    ForeColor="White" Height="28px" OnClick="btnSearch_Click2"
    Text="Search Jobz" Width="117px" />
person Tim Down    schedule 22.01.2010
comment
Не для кода, указанного в его вопросе, но я подумал, что включу объект события в свой ответ на тот случай, если его образец был упрощенной версией большей части кода, как это часто бывает :) +1 - person Andy E; 22.01.2010
comment
@Энди Э: согласился, и я, возможно, сделал бы то же самое, если бы вы еще этого не сделали. - person Tim Down; 22.01.2010

arrow_upward
1
arrow_downward

Я столкнулся с той же проблемой (window.event в firefox) с приведенным ниже кодом.

<html>
<body onkeyup="fClosePop();">
</body>
<script language="javascript">
  function fClosePop(){
        var e= (window.event)?event.keyCode:evt.which;  
        if( e.keyCode ==27)
        {
            try
            {
                alert(1);
            }
            catch(e)
            {

            }
        }      
    } 
</script>
</html>

Затем я попытался настроить код и нашел решение ниже. Я только что передал событие из функции.

<html>
<body onkeyup="fClosePop(even);">
</body>
<script language="javascript">
  function fClosePop(e){
           if( e.keyCode ==27)
           {
                      try
                      {
                       alert(1)
                       }
                      catch(e)
                      {

                      }
            }      
    } 
</script>
</html>

Я надеюсь, что это будет полезно для вас.

person Narendra    schedule 02.03.2012