I am having trouble sending information of a session cookie when loading a page.
Here is how the function executes
<body onload="example();">
Here is the function it self
function example() {
websocket.send("<?php print($_SESSION['example']) ?>")
}
I've tried this way as well, but still does not work.
function example() {
websocket.send("Test")
}
I also tried calling this function when a button is clicked and it does work.
I was thinking maybe the connection to the websocket is not fast enough and the example(); function is called before the connection is established. Please let me know how I can make this work.
This a complete example of how to connect to a WebSocket from the onload document event:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>WebSocket Sample</title>
<script type="text/javascript">
function example()
{
// open websocket
var socket = new WebSocket('ws://localhost:80');
socket.onopen = function() {
console.log("onopen!");
// Web Socket is connected. send an initial random message.
socket.send("Hello!");
};
}
</script>
</head>
<body onload="example();">
<h1>Title</h1>
</body>
</html>
I found out that the connection stablish after the execution of the function so what I simply did was setTimeout, even duh its not a good practice, it will be enough for the project am doing. Here is short version of my solution.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<script language="javascript" type="text/javascript">
function example() {
function sendUser() {
setTimeout(
function() {
websocket.send("Wroked!")
}, 1000);
}
}
</script>
</HEAD>
<BODY onload="example();">
</BODY>
</HTML>
Related
I'm having an issue where I'm trying to set a page's redirect destination to a URL from a JS function.
I've tried calling the function by using <meta http-equiv="refresh" in the header, but I either have the syntax wrong or <meta> simply doesn't allow for calling functions. I'm honestly not sure.
<head>
<script src="extFile.js"></script>
<meta http-equiv="refresh" content="1; go2();" id="levP" name="levP">
<title>SO Question</title>
</head>
go2() is a function from extFile.js which contains an if/then statement that provides different URLs depending on time of day. I'd like to have index.html redirect users via function go2() either by a method in the header or in the body.
If this should be handled in the body then I'd appreciate any feedback as to how that should look.
Like this? this code will redirect your page after 5 seconds
<head>
<script src="extFile.js"></script>
<script>
setTimeout(function (){
window.location = "https://stackoverflow.com/questions/57717282/how-to-set-redirect-to-links-provided-by-js-function";
}, 5000);
</script>
<title>SO Question</title>
</head>
if you want a to call a function do this:
<head>
<script src="extFile.js"></script>
<script>
var check = function(){
window.location = "https://stackoverflow.com/questions/57717282/how-to-set-redirect-to-links-provided-by-js-function";
}
check();
</script>
<title>SO Question</title>
</head>
I have a socket.io server that works, and that returns a number from 1 to 10 every second, that's the content of message.
But when I want to do dynamic content, it does not work, and the div#para stays on connection ...
This does not come from the exchange of data, since when I replace the line Document.get ... with alert (message), it works perfectly.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Socket.io</title>
</head>
<body>
<h1>Communication avec socket.io !</h1>
<div id='para'>Connection..</div>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect('http://localhost:8080');
socket.on('message', function(message) {
Document.getElementById('para').innerHTML = message;
})
</script>
</body>
</html>
Document should be document where you are setting the innerHTML property.
Why
Document is a constructor.
document is a global object.
The method getElementById() is only available on the global document object. As stated here.
I create a javascript Signalr Client, but I debug in Firefox, it shows "$ is undefined".
My index.html:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>SignalR Client</title>
<script src="Scripts/jquery-1.8.2.js"></script>
<script src="Scripts/jquery.signalR-2.2.0.js"></script>
<script src="/signalr/hubs"></script>
<script>
$(function () {
var connection = $.hubConnection('http://localhost:8080');
var hub = connection.ChatHub;
$.connection.hub
.start()
.done(function () {
$('#send').click(function () {
hub.server.hello();
});
});
});
</script>
</head>
<body>
<button id="send">Say Hello!</button>
<p id="message"></p>
</body>
</html>
I have searched some topics like this but it's not working.
I also created a console application and it connected to my HubServer.
The reference is like this image below.
This means that jQuery is not being included, you may load it from Google or jQuerys own CDN if you local link is not good.
I have a page that references an external javascript file, and when I tell it run a function onload, it is giving me errors (I assume because it is firing before the page is loaded.) "Cannot set property 'innerHTML' of null"
What do I need to do here to fire run() after the page is loaded?
HTML
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<script type="text/javascript" src="js/test.js"></script>
</head>
<body>
<div id="test"></div>
</body>
</html>
JS
window.onload = run();
function run() {
document.getElementById("test").innerHTML = "found it";
}
It should be:
window.onload = run;
When you do:
window.onload = run();
You're actually running the function called run, and then assigning its return-value (undefined in this case) to window.onload.
This function is running before the page even gets loaded (since you are running it explictly by doing run()), at which time the div with id test doesn't even exist. This is why you're getting the error.
Try this instead:
window.onload = run
When you do window.onload = run() you are immediately executing run() and assign whatever is returned to the window.onload property. This is why it’s not working correctly.
I just started learning Javascript, and I know next to nothing. I am trying to attached an onclick event to an element in my HTML.
var joinList = function() {
alert("This should display when clicked");
}
document.getElementById("header").onclick = joinList;
This is my code so far. Nothing happens when the element with the ID of header is clicked on. What am I doing wrong?
the following is my HTML code
<!DOCTYPE html>
<html>
<head>
<title>Testing Page</title>
<script src="testing.js"></script>
</head>
<body>
<h1 id="header">Andrew Dawson</h1>
</body>
</html>
The issue is, that you try to load a html element, which does not "exists" when the javascript function is executed, because the dom has not finished loading.
To make your code work, you can try following solutions:
Place your script tag below in the HTML:
<!DOCTYPE html>
<html>
<head>
<title>Testing Page</title>
</head>
<body>
<h1 id="header">Andrew Dawson</h1>
<script src="testing.js"></script>
</body>
</html>
Add an event handler to check if the window element is ready:
window.addEventListener("load", eventWindowLoaded, false);
function eventWindowLoaded(){
var joinList = function() {
alert("This should display when clicked");
}
document.getElementById("header").onclick = joinList;
}
Another solution would be to use jquery framework and the related document ready function
http://api.jquery.com/ready/
I think the solve you are looking for is
var joinList = function() {
alert("This should display when clicked");
}
document.getElementById("header").setAttribute("onclick", joinList);
Your code seems straight forward, maybe your script is running before the DOM fully loads. To keep it simple across all browsers we can place a self executing anonymous function at the end to initiate all your scripts after DOM loads.
<html>
<title></title>
<head></head>
<body>
html here!!
<script>
(function() {
//Any other scripts here
var joinList = function() {
alert("This should display when clicked");
}
document.getElementById("header").onclick = joinList;
})();
</script>
</body>
</html>
The above is purely javascript, not to be confused with the shorthand (see below) of the jquery "document onready" function (you would need to add jquery to your pages).
$(function() {
//your javascript code here
});
Why using self executing function?