个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
25
4
我有一个简单的代码，它是一个单页应用程序。我有几个 html header ，每个 header 都分配给不同的类名。我正在尝试根据 websocket 接收到的信号显示/隐藏它们。此外，我已将 onclick 事件绑定(bind)到其中一些 header 。但是一旦我单击标题，它就会抛出一个错误，指出函数未定义。谁能告诉我我在这里做错了什么。
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>MultiTask Performance Testing</title>
<style type="text/css">
.loading {
display: none;
}
.overview {
display: none;
}
.charge {
display: none;
}
.discharge {
display: none;
}
.active {
display: block;
}
</style>
</head>
<body>
<!-- LOADING SCREEN -->
<h1 class="loading active">Loading....</h1>
<!-- OVERVIEW SCREEN -->
<br />
<a id="screen1-charge" class="overview" onclick="myFunction()" href="#">enter loading mode</a>
<br />
<a id="screen1-discharge" class="overview" onclick="dischargeFunction()" href="#">enter discharge mode</a>
<!-- CHARGE SCREEN -->
<h1 class="charge">CHARGE</h1>
<!-- DISCHARGE SCREEN -->
<h1 class="discharge">DISCHARGE</h1>
</body>
<script src="vendor/jquery-1.10.1.min.js"></script>
<script src="socketHandler.js"></script>
<script>
document.onreadystatechange = function () {
if (document.readyState === 'complete') {
console.log("*** READY ***");
var socketController = new ReconnectingWebSocket("ws://localhost:1337");
function myFunction() {
console.log("###############INSIDE myFunction###########");
//socketController.sendMessage(JSON.stringify(["sig-request-enter-charge"]));
}
function dischargeFunction()
{
socketController.sendMessage(JSON.stringify(["sig-request-enter-discharge"]));
}
}
};
</script>
</html>
部分SocketHandler.js文件
function ReconnectingWebSocket(url, protocols) {
...
this.onmessage = function(event) {
var data = event.data;
try{
// If the string is UTF-8, this will work and not throw an error.
data= decodeURIComponent(escape(data));
}catch(e){ }
var msg = $.parseJSON(data);
console.log("*** *** *** Message received :" + msg[0]);
if (msg[0] == "error") {
console.error(msg[1]);
}
else if(msg[0] == "sig-app-state-changed")
{
console.log("*****inside else if statement");
var elements = document.getElementsByClassName('overview');
for (var i in elements) {
if (elements.hasOwnProperty(i)) {
elements[i].className = 'overview active';
}
}
var elementy = document.getElementsByClassName('loading active');
for(var i in elementy){
if(elementy.hasOwnProperty(i)){
elementy[i].className = 'loading';
}
}
}
else if(msg[0] == "sig-reply-enter-charge"){
var elements = document.getElementsByClassName('overview');
for (var i in elements) {
if (elements.hasOwnProperty(i)) {
elements[i].className = 'overview active';
}
}
var elementy = document.getElementsByClassName('charge');
for(var i in elementy){
if(elementy.hasOwnProperty(i)){
elementy[i].className = 'charge active';
}
}
}
else {
//SignalsController.parseMessage(msg);
console.log("inside else condition");
//console.log(msg[1])
console.log("--received--->", msg);
}
...
}
收到信号“sig-app-state-changed”后的样子 
最佳答案
函数声明在当前作用域中创建一个变量。
您已在分配给 document.onreadystatechange 的匿名函数中声明了 function myFunction() {，因此只能从该函数内部访问它。
您正试图从该函数外部调用它，因此它不存在。
使用 addEventListener 绑定(bind)您的事件处理程序(并在正确的范围内执行)而不是使用 onclick 属性。
关于javascript - 单页应用程序 : Uncaught ReferenceError: myFunction is not defined，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46827928/
25
4
0
我有一个单页应用程序。单击导航链接时，有一个脚本会向下滚动到适当的部分。这工作正常。 $('nav a').click(function(){ $('html, body').animate(
如今，有许多很酷的工具可用于创建功能强大的“单页” JavaScript网站。在我看来，这是通过让服务器充当API（仅此而已）和让客户端处理所有HTML生成内容来正确完成的。这种“模式”的问题是缺乏搜
我正在尝试创建一个页面，滚动站点包含一组图像和相应的标题。我想将标题固定在页面底部。我想解决方案将涉及为每个图像分配一个 id，当它位于距窗口顶部一定距离内时将触发隐藏/显示事件。在 this exa
我在一个页面上有两个表单:登录表单和注册表单。当我提交注册表单时，它会验证以下两项:登录和注册中的表单字段。如果两个表单具有相同的模型(用户模型)，我该如何处理 登记表 Form->create('U
我正在寻求帮助来自动化我的单页 Angular 应用程序的性能测试。我们正在使用 Protractor 进行 E2E 测试，并希望添加性能测试。我们的第一个目标是能够测量例如之间的简单时间。按钮单击并
我正在创建单页 Web 应用程序。 我为应用程序结构创建了一个基本设计。 This回答关于 this视频非常有帮助。 该应用程序包含一个 html 页面。 JS代码将改变它的内容。Usher 将根据
我只是想知道在不使用 ember js/angular js 等框架的情况下使用 javascript 创建单页网站的技术是什么。 例如在php中他们可以得到 example.com?view=hom
我刚刚读到有关公开用于检索数据的 RESTful 接口(interface)的单页 Web 应用程序 - 例如以 JSON 格式，并且只提供一个引用负责调用 RESTful 接口(interface)
我的单页框内容没有像我希望的那样响应迅速。当我尝试阅读以下页面时:https://institutoschuman.org/en/the-monographies/使用我的手机，右侧的文字被裁剪了。看
我正在构建我的第一个 WebApp。我的头部有一个小导航栏，其中应该放置后退按钮。应用程序的页面全部放置在一个文档中，因此 div 设置为 并且将通过点击链接来显示 onclick="show('P
好吧，这个问题我们都看过一百万次了，但我正在寻找更新的答案。 我们如何在安装 Wordpress 时使用 SSL 加密单个页面？更进一步，我们如何使该单个页面通过 SSL 与服务器通信？ 注意:您不能
我有一个单页 Wordpress 站点，它从其他帖子获取主页上的所有内容。我安装了 yoast 插件，但我想知道我是在每个帖子上输入关键字并放置 301 重定向，以便当它出现时它只转到主页，还是我不索
我们需要将现有的一系列页面/工作流屏幕更改/重写为一个标准页面。该项目本身本质上是在一个更大的现有应用程序的上下文中构建一个单一的网页应用程序。 我们的目标是尽可能让服务器端实现保持原样。这意味着我们
我正计划为 Wordpress 主题制作一个模板页面，它将在页面的内容部分加载 5 个单独的“模块”。这些模块旨在分别显示不同类别的最新 4 篇帖子(工作方式与 this 类似)。 在循环中处理此问题
情况 我正在制作一个包含多个页面的 Web 应用程序原型(prototype)，其中一些页面有大量的 JavaScript 负载。我有一个(不是很原始的)想法，让页面布局加载一次，并且只用 ajax
我想创建一个网页。我需要的是网页的大小应该根据用户窗口的大小而定，就像我们不需要向下滚动就可以看到某些东西一样。我可以将它更改为特定高度，但问题是在调整浏览器窗口大小时，它再次包含滚动选项，因为图像大
我需要设置 Magento 的订单成功页面 /checkout/onepage/success/ 的样式，但因为它在没有订单 session 时重定向，所以我无法刷新页面来检查我的更改! 有人知道如何
如何为单页 JavaScript 应用程序生成唯一的 URL。 这些 URL 应该像普通 URL 一样运行，即将其粘贴到浏览器中，如果用户具有权限，应用程序应该加载显示的特定 View 。 Gmail
我用过 skipfish和 Burp Suite 之前在“标准”Web 应用程序上。 但是我现在写的越来越多single-page apps ，在我的例子中是 backbone.js。 有没有软件可以
与其在单个 dropzone 元素上上传多个文件，不如在一个页面上有多个 dropzone 元素？ 当有多个元素时，似乎 dropzone 在选择对话框之后甚至没有触发，每个元素都有自己的 dropz
我是一名优秀的程序员,十分优秀！