Установка выражения наблюдения в Firebug: ReferenceError - s не определено - PullRequest
3 голосов
/ 11 июля 2009

Я пытаюсь понять, как использовать firebug для отладки моего Javascript. Итак, у меня есть HTML-код, указанный ниже. И я хочу установить выражение наблюдения на переменную 's'. Я пошел на вкладку Сценарий Firebug и открыл Панель просмотра и ввел s в область с надписью " Новое выражение для просмотра " ,

Я получаю сообщение об ошибке:

ReferenceError: s is not defined

Почему?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<style type="text/css">
.StateOne .InitiallyHidden { display: none; }
.StateTwo .InitiallyVisible { display: none; }
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
    $(document).ready(function()
    {

        $('.x').click(function() {
               var s = $("#StateContainer")[0];
               s.className = (s.className == 'StateOne' ? 'StateTwo' : 'StateOne');
        });

    });
</script>





</head>

<body>

<button class="x">Change StateContainer</button>

<div class="StateOne" id="StateContainer">
   <div class="InitiallyVisible">Visible first</div>
   <div class="InitiallyHidden">Visible second</div>
   <div class="InitiallyVisible">Visible first</div>
   <div class="InitiallyHidden">Visible second</div>
   <div class="InitiallyVisible">Visible first</div>
   <div class="InitiallyHidden">Visible second</div>
   <div class="InitiallyVisible">Visible first</div>
   <div class="InitiallyHidden">Visible second</div>
</div>



</body>
</html>

1 Ответ

6 голосов
/ 11 июля 2009

Переменная 's' определяется только внутри обработчика щелчка для 'x', потому что она объявлена ​​внутри функции. Если вы установите точку останова внутри функции щелчка, тогда 's' будет работать.

Как правило, не рекомендуется создавать глобальные переменные, но ради отладки можно сделать глобальную переменную 's', объявив ее вне функции $ (document) .ready (), например:

<script language="javascript" type="text/javascript">
    var s;
    $(document).ready(function()
    {

        $('.x').click(function() {
               s = $("#StateContainer")[0];
               s.className = (s.className == 'StateOne' ? 'StateTwo' : 'StateOne');
        });

    });
</script>
...