2013-02-18 4 views
0

Я просто пытаюсь заставить JQuery работать с моим рельсом.Проблема с JQuery in Rails 3.2

Я хотел бы поместить некоторые JQuery в моем new.html.erb файл, и я получаю следующее сообщение об ошибке в консоли Chrome:

Uncaught SyntaxError: Unexpected token ( 

Вот мой new.html.erb:

<% provide(:title, "New Stat") %> 
<% provide(:heading, "Welcome, #{ current_user.email }!") %> 

<div id="stats-page-container"> 
    <div id="stat-form" > 
    <div id="stat-form-inner"> 

    <% render 'layouts/init_stats_form' %> 
    <% render 'layouts/stat_input_form' %> 

    <script> 
     $.('#stat-form-inner').addClass('test-class'); 
    </script> 

    </div> 
</div> 
    <%= render 'layouts/progress' %> 
</div> 

ошибка в строке с кодом JQuery:

$.('#stat-form-inner').addClass('test-class'); 

Вот мой файл application.html.erb:

<html> 
<head> 
    <title><%= full_title(yield(:title)) %></title>  
    <h1> <%= yield(:heading) %> </h1> 
    <%= stylesheet_link_tag "application", :media => "all" %> 
    <%= csrf_meta_tags %> 
</head> 
<body> 
    <% flash.each do |key, value| %> 
    <%= content_tag(:div, value, class: "alert alert-#{key}")%> 
    <% end %> 

    <%= render 'layouts/header' %> 

    <% if user_signed_in? %> 
    <%= render 'layouts/subheader' %> 
    <% end %> 

    <%= yield %> 
    <%= debug(params) if Rails.env.development? %> 

    <%= javascript_include_tag 'application' %> 
</body> 
</html> 

И элемент с этим статусом stat-form-inner не имеет этого класса, добавленного к нему.

мой application.js файл имеет это в нем:

// = require jquery 
// = require jquery_ujs 
// = require_tree . 

Я также добавил

<%= javascript_include_tag 'application' %> 

непосредственно над окончанием тела тега.

Что еще мне не хватает?

Спасибо!

+1

Я не думаю, что «.» оператор требуется после $. Просто удалите его и отметьте –

+0

. Это дает мне следующее: Uncaught ReferenceError: $ не определен new: 63 (анонимная функция) –

ответ

2
  1. Убедитесь, что JQuery загружен правильно. Чтобы сделать это, удалите/комментируйте $ ('# stat-form-inner'). AddClass ('test-class') и откройте приложение в FF/chrome и введите $ или jQuery в консоли Firebug. Если он печатает функцию(), то jQuery загружается должным образом. Если он выдает ошибку Ссылка Ошибка, jQuery не определен, тогда структура JQuery не загружается.

  2. Если JQuery правильно загружена, то попробуйте следующие предложения

    Место это заявление <% = javascript_include_tag «приложения»%> внутри головы тега или в верхней части файла вид/макет.

    Попробуйте ниже фрагмент кода, чтобы добавить класс к элементу, предпочтительно в конце страницы (его хорошо поставить это даже после закрытия HTML тега)

    <script type="text/javascript"> 
        $(document).ready(function() { 
        $('#stat-form-inner').addClass('test-class'); 
        }); 
    </script> 
    

Надеется, что это помогает

+0

Да, это так. Я чувствую себя немой теперь LOL! Я поместил скрипт внутри элемента, а не в конец шаблона ... Это то, что происходит, когда вы кодируете слишком мало кофеина или сон: D Спасибо за вашу помощь! –

0

Вы добавляете javascript_include_tag над тегом тега окончания. Таким образом, это означает, что ваш скрипт выполняется до загрузки страницы jquery. переместите вызов javascript_include_tag на главный тег, и он должен работать.

+0

Я пробовал это, и он не работал. –

+0

это не помогает. можете ли вы включить суть вашего шаблона и макета? и любые ошибки. – jvnill

+0

Хорошо. Я добавил больше того, что содержат файлы. Это единственная ошибка, которую имеет мое приложение прямо сейчас. –

1

Поместите свои скрипты в папку app/assets/javascript, убедитесь, что используете $("..."), а не $.().

Добро пожаловать в Rails!

+0

Я добавляю этот скрипт непосредственно на страницу new.html.erb, чтобы позже использовать AJAX. –

+0

Вам все равно нужно исправить ошибку синтаксиса, независимо. – sevenseacat

Смежные вопросы