rail3.1 javascript coffecsript вопрос новичка - PullRequest
Новая
       6

rail3.1 javascript coffecsript вопрос новичка

1 голос
/ 05 сентября 2011

Я довольно новый To Javascript и Rails 3.1. Итак, теперь у меня есть приложение Rails и работает, и я делаю то, что хочу, НО: Я хотел добавить Eye Candy (например, хорошие выпадающие меню и т. Д.) С помощью Jquery / Coffescript

Я добавляю теги include, а application.js содержит мои собственные написанные методы / функции. Но я сталкиваюсь с некоторыми нежелательными поведениями: id добавил alert () к pages.js.coffee, и я надеялся, что я буду выполняться только при вызове чего-то из pages_controller, но он вызывается на каждой странице. Это почему? Во-вторых, я добавил небольшую тестовую функцию для окраски тегов <h1> следующим образом: 

app/assets/javascript/pages.coffee.js:

highlight_h1 = (color) ->
    $('h1').css('background',color)
#change colour on page load
$ -> highlight_h1 "red"
#add some click action for fun
$('#ccolor').click ->
    highlight_h1 "blue"

$('button').click ->
    highlight_h1 "yellow"

Теперь <h1> получает красный фон при загрузке страницы. Но ни одно из моих действий с кликами никогда не работает. Я что-то пропустил? Вот визуализированный HTML: 

<h1 id="ccolor" style="background-image: initial; background-attachment: initial;  background-origin: initial; background-clip: initial; background-color: red; background-position: initial initial; background-repeat: initial initial; ">Home</h1>
<p>Here Should be a Login Page an Stuff</p>
<button>make me yellow</button>
<a href="/users/sign_up" class="signup_button_round">Sign up now!</a>

есть намеки?

1 Ответ

0 голосов
/ 05 сентября 2011

Вопрос 1:

id добавил оповещение () к pages.js.coffee, и я надеялся, что будет выполняться только при вызове чего-то из pages_controller, но он вызывается на каждой странице,Это почему?

Как работает конвейер активов (по умолчанию), все ваши JS объединяются в единый минимизированный файл для производства.В режиме разработки оригинальные файлы подаются вместо этого, но они все еще находятся на каждой странице.Вам нужно будет сделать специфичный для конкретной страницы код, например, наличие определенного элемента: 

if $('#myPageElement').length > 0
  ...

Вопрос 2:

Теперь вы получите красный фон назагрузка страницы.Но ни одно из моих действий с кликами никогда не срабатывает.

Ваши теги <script> идут до <body>, поэтому ваш скрипт запускается сразу же.Когда это произойдет, элемент #ccolor еще не будет добавлен, или вообще не будет button - вообще никакого тела HTML.Вы можете обойти это, передав код в виде функции в объект jQuery - как вы сделали с вызовом highlight_h1, но не с остальным кодом - чтобы запускаться только после того, как весь документ будет готов: 

$ -> 
  highlight_h1 "red"

  #add some click action for fun
  $('#ccolor').click ->
      highlight_h1 "blue"

  $('button').click ->
      highlight_h1 "yellow"

Перефразируя Гомера Симпсона: «Отступам! Причины и решения всех жизненных проблем».

Plug: В jQuery есть главамоя книга, CoffeeScript: ускоренная разработка JavaScript .Он предназначен для начинающих и должен помочь вам лучше понять подобные проблемы.

...