2016-01-06 25 views
0

我举了一个jquery移动数据角色的例子,它在浏览器外呈现的很好,但是当我将代码放到我的Rails应用程序中时,没有任何按钮呈现和jquery手机似乎根本不工作?jquery mobile无法在rails 4中运行应用程序

我是不是这样做或我需要安装jquery_mobile_rails gem而不是简单地链接CDN的头部? 我已经安装了jquery rails gem,其他jquery插件在我的应用程序中运行得很好。嗯...

<!DOCTYPE html> 
<html class="no js"> 
    <head> 
    <title>Tumblful</title> 

    <meta charset="UTF-8" /> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
    <%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track" => true %> 
    <%= javascript_include_tag "application", "data-turbolinks-track" => true %> 
    <%= csrf_meta_tags %> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta name="description" content="Fullscreen Background Image Slideshow with CSS3 - A Css-only fullscreen background image slideshow" /> 
<!-- <link rel="stylesheet" type="text/css" href="css/demo.css" /> 
    <link rel="stylesheet" type="text/css" href="css/style1.css" /> --> 
    <script type="text/javascript" src="js/modernizr.custom.86080.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Readmore.js/2.1.0/readmore.min.js"></script> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" /> 
    <link rel="stylesheet" href="http://demos.jquerymobile.com/1.4.0/theme-classic/theme-classic.css" /> 
    </head> 

<%= yield :body || "<body>" %> 



<div data-role="page" data-theme="a"> 
<div data-role="header" data-theme="a"> 
    <h1>My Title</h1> 
    </div> 
    <!-- /header --> 
    <div data-role="content" data-theme="a"> 
    <a data-inline="true" data-corners="false" data-role="button" class="ui-link-inherit" onclick="FunctionToDoTask1();">BTN1</a> 
    <a data-inline="true" data-corners="false" data-role="button" class="ui-link-inherit" onclick="FunctionToDoTask2();">BTN2</a> 
    <a data-inline="true" data-corners="false" data-role="button" class="ui-link-inherit" href="#popUp1" data-rel="popup">BTN3</a> 
    <a data-inline="true" data-corners="false" data-role="button" class="ui-link-inherit" href="#popUp2" data-rel="popup" onclick="FunctionToDoTask3();">BTN4</a> 

     <a href="#" data-role="button">A simple Button</a> 
    </div> 
    <!-- /content --> 
</div> 
<!-- /page --> 



    </body> 
</html> 

回答

1

Rails 4有TurboLinks,它基本上把你的应用程序变成单页面的​​应用程序。因此,脚本不会在页面更改上运行。尝试在application.html.erb中将<body data-no-turbolink="true">添加到您的身体标记中,然后查看是否解决了您的问题!

相关问题