我有一个JavaScript代码,用于设置websocket连接并具有多种功能。 该websocket正常工作。 但是我想从HTML代码内的脚本运行javascript函数。这不起作用。如果我通过onclick事件运行该函数,那么它将正常工作(请参见按钮)。
我已经尝试了body onload,但是它不起作用。
我的目标是:如果加载了网页,请执行OnloadFunction函数。然后,它应该使用websocket发送一个字符串。
<!DOCTYPE html><html>
<head>
<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">
<link rel=\"icon\" href=\"data:,\">
<title>Testpage</title>
<meta charset="UTF-8">
<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center; background-color:#5593F1}
.button { background-color: #195B6A; border: none; color: white; padding: 10px 40px;
text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}
.button2 {background-color: #77878A;}
</style>
<script>
var connection;
connection = new WebSocket('ws://' + window.location.hostname + ':81/');
connection.onopen = function () { connection.send('Connect ' + new Date()); };
connection.onerror = function (error) { console.log('WebSocket Error ', error);};
connection.onmessage = function (e) { console.log('Server: ', e.data);};
function OnloadFunction() {
connection.send('* Test22');
alert("Hello! ");
}
</script>
</head>
<body onload="javascript:OnloadFunction();">
<h1>Testpage</h1>
<p>Suche....</p>
<p><a href="/read.html"><button class="button" onclick="OnloadFunction()">read</button></a></p>
</body>
</html>
这是我的简单测试,但也无法正常工作
<body>
<h1>Test</h1>
<p>Suche...</p>
<p><a href="/read.html"><button class="button" onclick="OnloadFunction()">Lesen</button></a></p>
<script>
var connection = new WebSocket('ws://' + window.location.hostname + ':81/');
connection.onopen = function () { connection.send('Connect ' + new Date()); };
connection.onerror = function (error) { console.log('WebSocket Error ', error);};
connection.onmessage = function (e) { console.log('Server: ', e.data);};
connection.send('* Test22');
</script>
</body>
怎么了?如果加载了网络端,如何在html代码中执行功能OnloadFunction()?
EDIT1: 感谢您的所有建议。我尝试了很多不同的方法,但是没有用。
现在我已经接近解决方案,但是我不了解新的错误。 由于window.onload = start;函数start()被执行; 但是连接后的代码。onmessage= function(evt){console.log(evt);}; 仅在alert(“ TEST ___”);时执行。在代码中。如果我删除此行,那么之后的代码将不会执行。为什么没有警报(“ TEST___”)无法执行代码; ??按下按钮后,所有设置都可以正常运行,而不会发出警报。
这是我的代码websock2.js(更改仅用于测试):
var connection;
function OnloadFunction() {
connection.send('* Test22'+' x');
alert("LOADED! ");
}
function start() {
alert("Start! ");
connection = new WebSocket('ws://' + window.location.hostname + ':81/');
<!-- connection = new WebSocket('ws://192.168.1.5:81/',['arduino']); -->
connection.onopen = function () { connection.send('Connect ' + new Date()); };
connection.onerror = function (error) { console.log('WebSocket Error ', error);};
connection.onmessage = function(evt) { console.log(evt);};
alert("TEST___");
connection.send('* Test22'+' x');
console.log('effekt: ');
alert("LOADED! ");
}
window.onload=start;
这是我的html代码:
<!DOCTYPE html><html>
<head>
<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">
<link rel=\"icon\" href=\"data:,\">
<title>Testpage</title>
<meta charset="UTF-8">
<script src="websock2.js" async></script>
<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center; background-color:#5593F1}
.button { background-color: #195B6A; border: none; color: white; padding: 10px 40px;
text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}
.button2 {background-color: #77878A;}
</style>
</head>
<body>
<h1>Testpage</h1>
<p>read....</p>
<p><a href="/read.html"><button class="button" onclick="OnloadFunction()">Lesen</button></a></p>
</html>