个人中心
gpt4 book ai didi

javascript - Rails View javascript 未加载

转载 作者：行者123 更新时间：2023-11-27 22:48:59 24 4
gpt4 key购买 nike

我目前正在尝试使用 js 在 c9 上为我的 Rails 应用程序编写一个测验，但 js 似乎没有加载到 View 文件中。谁能告诉我出了什么问题或建议修复吗？

主页上有测验开始:

<div class = "signinstyle">
  <div class = "row">


    <div id="wrapAll">
        <div id="wrapper">

                <img id="logo" src="img/geek.png" alt=""><br>
                 <h1>Help us recommend a <span>Course</span></h1>

                 </div>
                 </div>
                 </div>
                 <div class ="row">
                    <div id="wrapper">
                <input class="start-btn" type="submit" value="Start!" onclick="redirect('ques.html')">

        </div>
    </div>



</div>


    <script src='main.js' type='text/javascript'></script>

应该从 js 中提取问题的 View :

    <!--Functionality of recommender?? --> 
    <% provide(:title, '') %>


    <!--containers for design/layout --> 
    <div class = "signinstyle">
      <div class = "row">
        <!--Page information --> 


        <div id="wrapAll">
            <div id="wrapper">

                    <div class="ques-wrap">
                        <h2 id="ques">This is question</h2>
                        <input class="btn1" type="submit" id="opt1" value="Option 1" onclick="optionClick('1')">
                        <input class="btn2" type="submit" id="opt2" value="Option 2" onclick="optionClick('0')">
                        <div class="clear"></div>

                </div>
            </div>
        </div>

        </div>
        </div>
        <script src='main.js' type='text/javascript'></script>
        <script type='text/javascript'>
            window.onload = function(){
              generate();
            };
        </script>

应用程序布局 View : 

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title><%= yield(:title) %> | Uni2choose</title>

  <%= javascript_include_tag "https://www.google.com/jsapi", "chartkick" %>
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true  %>
  <%= csrf_meta_tags %>

</head>
<body>

  <%= render 'layouts/navbar' %>
  <%= render 'layouts/header' %>

<br><br><br><br>

      <% flash.each do |message_type, message| %>
        <div class="alert alert-<%= message_type %>"><%= message %></div>
      <% end %>


      <%= yield %>




<%= render 'layouts/footer' %>
</body>





</html>

main.js 文件:

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require chartkick
//= require turbolinks
//= require_tree .



var data = {
    questions: [{
            question: "Which interests you most?",
            options: [ "Medicine" , "Drama" ]
        }, {
            question: "Which interests you most?",
            options: [ "Biology" , "Music" ]
        }, {
            question: "Which interests you most?",
            options: [ "Chemistry" , "Sculpting" ]
        }, {
            question: "Which interests you most?",
            options: [ "Psychology" , "Design" ]
        }, {
            question: "Which interests you most",
            options: [ "Animals" , "Art" ]
        }, {
            question: "Which interests you most",
            options: [ "Maths" , "Outdoors" ]
        }, {
            question: "Which interests you most?",
            options: [ "Engineering" , "English" ]
        }, {
            question: "Which interests you most?",
            options: [ "Computing" , "Ancient history" ]
        }, {
            question: "Which interests you most?",
            options: [ "Physics ", "Dance" ]
        }, {
            question: "Which interests you most?",
            options: [ "Geography" , "Fashion" ]
        }, {
            question: "Which interests you most?",
            options: [ "History" , "Dentistry" ]
        }, {
            question: "Which interests you most?",
            options: [ "Debating" , "Photography" ]
        }, {
            question: "Which interests you most?",
            options: [ "Creative Writing" , "Accounting" ]
        }, {
            question: "Which interests you most?",
            options: [ "Archaeology " , "Hospitality" ]
        }, {
            question: "Which interests you most?",
            options: [ "Construction " , "Teaching" ]
        }, {
            question: "Which interests you most?",
            options: [ "Graphics" , "Philosophy" ]
        }, {
            question: "Which interests you most?",
            options: [ "Business" , "Drawing" ]
        }, {
            question: "Which interests you most?",
            options: [ "Nutrition" , "Politics" ]
        }, {
            question: "Which interests you most?",
            options: [ "Sports" , "IT" ]
        }, {
            question: "Which interests you most?",
            options: [ "Economics" , "Languages" ]
        },],
    geeks: [
        {
            name: "Linus Torvalds",
            info: "Linus Benedict Torvalds is a Finnish American software engineer, who was the principal force behind the development of the Linux kernel that became the most popular kernel for operating systems."
        }, {
            name: "Dennis Ritchie",
            info: "Dennis MacAlistair Ritchie was an American computer scientist. He created the C programming language and, with long-time colleague Ken Thompson, the Unix operating system."
        }, {
            name: "Bill Gates",
            info: "William Henry 'Bill' Gates III is an American business magnate, philanthropist, investor, computer programmer, and inventor."
        }, {
            name: "Steve Jobs",
            info: "Steven Paul 'Steve' Jobs was an American entrepreneur, marketer, and inventor, who was the cofounder, chairman, and CEO of Apple Inc."
        }, {
            name: "Steve Wozniak",
            info: "Stephen Gary 'Steve' Wozniak, known as 'Woz', is an American inventor, electronics engineer, and computer programmer who co-founded Apple Computer with Steve Jobs and Ronald Wayne."
        }, {
            name: "Mark Zuckerberg",
            info: "Mark Elliot Zuckerberg is an American computer programmer and Internet entrepreneur. He is best known as one of five co-founders of the social networking website Facebook. Zuckerberg is the chairman and chief executive of Facebook, Inc."
        }, {
            name: "Tim Berners-Lee",
            info: "Sir Timothy John 'Tim' Berners-Lee, also known as TimBL, is an English computer scientist, best known as the inventor of the World Wide Web."
        }]
};

var qIndex = 0,
    index = 0,
    aString = "",
    maxQ = 20,
    q = document.getElementById('ques'),
    opt1 = document.getElementById('opt1'),
    opt2 = document.getElementById('opt2');

function generate(){
    q.innerHTML= data.questions[qIndex].question;
    opt1.value= data.questions[qIndex].options[0];
    opt2.value= data.questions[qIndex].options[1];
}

function optionClick(ans) {
    if(qIndex%2==0){
        aString+=ans;
        index++;
    }
    qIndex++;
    if(qIndex == maxQ){
        redirect( "result.html?" + generateResult(aString) );
    } else{
        generate();
    }
}

function generateResult(answers) {
    if( answers=="11110" || answers=="11000" || answers=="01000" ) return 0;
    else if( answers=="11111" || answers=="01010" ) return 1;
    else if( answers=="10011" || answers=="00111" || answers=="00101" ) return 2;
    else if( answers=="10100" || answers=="00110" || answers=="00000" ) return 3;
    else if( answers=="10101" ) return 4;
    else if( answers=="11101" || answers=="10010" || answers=="01111" ) return 5;
    else return 6;
}

function showResult() {
    var id = window.location.search.substring(1);
    var Geeks = data.geeks;
    var totalGeeks = Object.keys(Geeks).length - 1;
    if( id > totalGeeks || id < 0 || !id ) redirect("index.html");
    var name = document.getElementById("geekName");
    var info = document.getElementById("geekInfo");
    var img = document.getElementById("geekImage");
    name.innerHTML = Geeks[id].name;
    img.src = "img/"+id+".png";
    img.alt =Geeks[id].name;
    info.innerHTML = Geeks[id].info;
}

function redirect(url) {
    window.location = url;
}

最佳答案

您的问题在以下行

 <script src='main.js' type='text/javascript'></script>

它将从公共(public)路径而不是 Assets 路径中搜索。所以改成

<%= javascript_include_tag 'main'  %>

关于javascript - Rails View javascript 未加载，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38205440/

24 4 0
文章推荐： c++ - 如何使用 Crypto++ 库创建 HMAC 256？
文章推荐： html - 在元刷新时提交表单？
文章推荐： php - PHP 是否可以在不使用 javascript 的情况下使用 HTML 5 地理定位？
文章推荐： javascript - 后续 anchor 标记在 html/php 中不起作用
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com