Почему этот код jQuery не работает для изменения цвета фона в Firefox? - PullRequest
Новая
       14

Почему этот код jQuery не работает для изменения цвета фона в Firefox?

2 голосов
/ 29 апреля 2009

Я пытаюсь освоить jQuery, и у меня был этот простой фрагмент кода, который отказывается работать. Кто-нибудь понял, почему это может не сработать? 

<html>
  <head>

  <script type="text/javascript" src="jquery.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
      $("div").live("click", divclicked);
    });

    function divclicked()
    {
      if($(this).css("background-color") == "lightblue")
        $(this).css("background-color", "red");
    }
  </script>

  <style type="text/css">

      div
      {
         background-color: lightblue;
      }

  </style>

  </head>
  <body>
    <div id="testdiv">
      this is a test
    </div>
  </body>
</html>

Заранее спасибо за любые материалы.

Обновление: Приведенное ниже решение использовать «backgroundColor» вместо «background-color» работает, когда стиль является встроенным, а не при использовании таблицы стилей. 

I have updated the example to use a stylesheet.

Ответы [ 2 ]

6 голосов
/ 29 апреля 2009

Попробуйте изменить background-color на backgroundColor в вашем скрипте: 

if($(this).css("backgroundColor") == "lightblue")
  $(this).css("backgroundColor", "red");

DOM стремится избегать использования пунктирных имен, поскольку они не являются допустимыми идентификаторами JavaScript.

Argh! Паоло удалил свой ответ, когда я печатал комментарий к нему ... Я не осознавал, что передача "background-color" в .css() сделает что-нибудь полезным, а тем более вернет реальное значение RGB ! В вашем случае эффект тот же (поскольку вашей логике нужно точно сохранить исходное значение), но все же стоит обратить внимание на будущее.

Кроме того: если вы используете классы CSS вместо того, чтобы полагаться на возможность читать и писать стиль напрямую, вам будет намного легче - jQuery очень хорошо работает с классами CSS, предоставляя простые способы check , переключить и изменить их.

1 голос
/ 29 апреля 2009

Ответ выше, вероятно, точечный на

Чтобы не запутаться из-за различий в синтаксисе, как в js по сравнению с css, я склонен менять CSS в jquery с использованием синтаксиса JSON 

$(this).css({'background-color':'red', height:'200px'});

Тогда все, что вам нужно запомнить, это 2 основных правила, которые всегда работают: запятые вместо двоеточий и заключать в кавычки любое имя свойства через дефис.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...