Question

我在ThemeForest上买了一个主题，它使用了一堆jQuery插件（easytabs，datepicker等）。我试图让他们在我的Rails应用程序中工作。他们都没有。以下是我认为我需要做的工作：

1）将jQuery插件复制到vendor / assets / javascripts文件夹中 2）在application.js文件中要求它 3）在[view] .js.coffee文件中调用它 - 在我的例子中contacts.js.coffee
4）将所需的HTML放入[view] .html.erb文件中（没有javascript等，只需将相应的ID等插入到jQuery插件将要操作的部分中

我显然遗漏了一些东西，因为它们都不起作用。我工作的唯一一个jQuery插件是DataTables插件，但我跟着它一个RailsCast，并使用它的gem安装它。 RailsCast提到，“幸运的是，这有一个宝石，或者我们必须通过并修复破损的图像链接......”

我是Rails / web开发的新手，现在我已经在这个墙上敲了几天，所以我不想盲目地开始更新jQuery文件中的链接。

我应该如何解决此问题？

这里是我（大部分）剪切和粘贴的代码：

来自Application.js的

：

 WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require jquery
//= require jquery_ujs
//= require dataTables/jquery.dataTables
//= require plugins/ui/jquery.easytabs.min
//= require_tree .

来自properties.js.coffee的

：

# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/
jQuery ->
  $('#properties').dataTable
    sPaginationType: "full_numbers"
    bProcessing: true
    bServerSide: true
    sAjaxSource: $('#properties').data('source')
  $('#tab-container').easytabs
    animationSpeed: 300,
    collapsible: false,
    tabActiveClass: "clicked"

来自属性的index.html.erb：

<!-- Tabs -->
        <div class="fluid">
            <div class="widget grid6">       
                <ul class="tabs">
                    <li><a href="#tabb1">Tab active</a></li>
                    <li><a href="#tabb2">Tab inactive</a></li>
                </ul>

                <div class="tab_container">
                    <div id="tabb1" class="tab_content">
                        Tab is active and has left tabs             
                    </div>
                    <div id="tabb2" class="tab_content"> This tab is active now</div>
                </div>  
                <div class="clear"></div>        
            </div>

            <div class="widget grid6 rightTabs">       
                <ul class="tabs">
                    <li><a href="#tabb3">Tab active</a></li>
                    <li><a href="#tabb4">Tab inactive</a></li>
                </ul>
                <div class="tab_container">
                    <div id="tabb3" class="tab_content">
                        Tab is active and has right tabs               
                    </div>
                    <div id="tabb4" class="tab_content"> This tab is active now</div>
                </div>  
                <div class="clear"></div>        
            </div>
        </div>

这是我的github帐户，如果你真的想要看到我所做的一切，那就是它的荣耀 https://github.com/jonlehman/REAPP

Answer 1

在你的coffeescript中你写了

$('#tab-container').easytabs

然而在你的html中没有id为tab-container的元素，但你确实使用了一个名为tab_container的类（注意下划线），所以你的coffeescript应该是

$('.tab_container').easytabs

希望这有帮助。

我如何在Rails中安装和使用jQuery插件？

1 个答案: