堆栈内存溢出
  繁体   English   中英

我已经编写了 JavaScript 代码来获取某一天的讲座，但我不知道如何将我的 jQuery 链接到 JavaScript

[英]I have written JavaScript code to fetch lectures of a particular day but I am not getting how to link my jQuery to JavaScript

 原文  2019-03-22 12:19:26  6   1    javascript/ jquery/ html/ bootstrap-4

问题描述

这是一个 JavaScript 函数，用于获取我们使用 jQuery 的类的选定部分的今天讲座。 我正在使用 JavaScript 获取今天的类数组，但是如何在 html 文件上实现这个数组？ 

 //function to get today var today = new Date(); var dd = today.getDate(); var mm = today.getMonth() + 1; //January is 0! var yyyy = today.getFullYear(); if (dd < 10) { dd = '0' + dd } if (mm < 10) { mm = '0' + mm } today = mm + '/' + dd + '/' + yyyy; var days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']; var d = new Date(today); var dayName = days[d.getDay()]; var section = 2; console.log(dayName) console.log(section) function fetchCominUp(day, sec) { if (sec === 1) { if (day === "Monday") { var classes = new Array(); classes[0] = "CG"; classes[1] = "DW"; classes[2] = "CD"; classes[3] = "CN"; return classes; } if (day === "Tuesday") { var classes = new Array(); classes[0] = "CD"; classes[1] = "CN"; classes[2] = "DW-Lab A & CG-Lab B"; classes[3] = "CG-Lab B & DW-Lab b"; return classes; } if (day === "Wednesday") { var classes = new Array(); classes[0] = "Apti"; classes[1] = "Apti"; classes[2] = "DW"; classes[3] = "CG"; return classes; } if (day === "Thursday") { var classes = new Array(); classes[0] = "IM"; classes[1] = "CN"; classes[2] = "CD"; classes[3] = "IS"; return classes; } if (day === "Friday") { var classes = new Array(); classes[0] = "DW"; classes[1] = "CG"; classes[2] = "CN-Lab A & CD-Lab B"; classes[3] = "CD-Lab B & CN-Lab B"; return classes; } if (day === "Saturday") { var classes = new Array(); classes[0] = ".NET"; classes[1] = "JAVA"; classes[2] = "NPTEL"; classes[3] = "SPorts"; return classes; } if (day === "Sunday") { var classes = new Array(); classes[0] = "Closed"; classes[1] = "Closed"; classes[2] = "Closed"; classes[3] = "Closed"; return classes; } return false; } else if (sec === 2) { if (day === "Monday") { var classes = new Array(); classes[0] = "CD"; classes[1] = "CG/WT"; classes[2] = "CN"; classes[3] = "DW"; return classes; } if (day === "Tuesday") { var classes = new Array(); classes[0] = "DW"; classes[1] = "CG/WT"; classes[2] = "CD"; classes[3] = "CN"; return classes; } if (day === "Wednesday") { var classes = new Array(); classes[0] = "IM"; classes[1] = "DW"; classes[2] = "CN-Lab A & CD-Lab B"; classes[3] = "CD-Lab A & CN-Lab B"; return classes; } if (day === "Thursday") { var classes = new Array(); classes[0] = "Apti"; classes[1] = "Apti"; classes[2] = "DW-Lab A & CG-lab B/WT-Lab(IT)"; classes[3] = "CG-Lab A & DW-Lab B"; return classes; } if (day === "Friday") { var classes = new Array(); classes[0] = "CN"; classes[1] = "CD"; classes[2] = "CG/WT"; classes[3] = "IS"; return classes; } if (day === "Saturday") { var classes = new Array(); classes[0] = ".NET"; classes[1] = "JAVA"; classes[2] = "NPTEL"; classes[3] = "SPorts"; return classes; } if (day === "Sunday") { var classes = new Array(); classes[0] = "Closed"; classes[1] = "Closed"; classes[2] = "Closed"; classes[3] = "Closed"; return classes; } return false; } } console.log(fetchCominUp(dayName, section))
 <!DOCTYPE html> <html lang="en"> <head> <title>Student Resource Portal</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <link href="style.css" rel="stylesheet"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous"> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> </head> <body> <!--This is our header--> <header> <nav class="navbar navbar-expand-sm sticky-top navbar-dark bg-primary"> <div class="container-fluid"> <a href="#" class="navbar-brand"><span class="navbar-brand mb-0 h1">Csians</span></a> <button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#myMenu" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <!--These are nav items--> <div class="collapse navbar-collapse" id="myMenu"> <ul class="navbar-nav ml-auto"> <li class="nav-item"> <a href="index.html" class="nav-link active">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Timetable</a> </li> <li class="nav-item"> <a class="nav-link" href="syllabus.html">Syllabus</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Notes</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Events</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Contribute</a> </li> </ul> </div> </div> </nav> </header> <!--today's time table--> <!--we have to use card and make table here--> <main> <div class="container"> <div class="card text-center"> <div class="card-header"> <h5>Today's Classes</h5> </div> <p> <button id="cse1" class="btn col-sm-3 col-md-3 btn-primary" type="button" data-toggle="collapse" data-target="" aria-expanded="false" aria-controls="">CSE A</button> <button id="cse2" class="btn col-sm-3 col-md-3 btn-primary" type="button" data-toggle="collapse" data-target="" aria-expanded="false" aria-controls="">CSE B</button> </p> <div class="row"> <div class="col"> <!--Here i want my section A lectures--> </div> <div class="col"> <!--Here i want my section B lectures--> </div> </div> </div> </div> </main> <!--Footer--> <!-- Footer --> <footer class="page-footer fixed-bottom font-small bg-primary"> <!-- Copyright --> <div class="footer-copyright text-center py-3"><span style="color:white">Handcrafted with </span> <i class="fas fa-music"></i><span style="color:white"> and </span> <i class="fas fa-laptop-code"></i> </div> <!-- Copyright --> </footer> <!-- Footer --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="/public/main.js"></script> <script type="text/javascript"> $("#cse1").click(function() { fetchCominUp(1); }) $("#cse2").click(function() { fetchCominUp(2); }) </script> </body> </html>

这张图片是我想展示今天讲座的部分的 html 代码 - 请帮助我如何使用 javascript 函数展示课程

jQuery

下面是我的 jQuery 函数，当我们点击 cse2 的 cse1 按钮时，它会获取 cse1 的时间表：

<script type="text/javascript">
    $("#cse1").click(function() {
        fetchCominUp(1);
    })
    $("#cse2").click(function() {
        fetchCominUp(2);
    })
</script>

1 个解决方案

解决方案1
 0 已采纳  2019-03-22 15:56:08

这是您的代码和修复程序的 jsfiddle 以获得您想要实现的目标。

Here is a link to jsfiddle单击此链接到 jsfiddle

我已经在 html 和 javascript 中更改了您的一些代码。 现在工作正常。

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何运行我用JavaScript编写的代码？ 我将如何在 Javascript 中编写用我的 HTML 代码编写的特殊字符？ 为什么我的 Javascript 代码中出现 [object HTMLInputElement]？ 我在JavaScript和jquery上的游戏角色代码遇到麻烦 我目前正在从我的代码中删除 jquery 并且我无法将此 Jquery 转换为 Javascript 如何在代码中找到特定的Javascript 如何在JavaScript代码中包含刷新页面链接/按钮？ 为什么我的JavaScript出错？ 我被这个 javascript/jquery 代码困住了 我的JavaScript代码中缺少什么？
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM