My HTML script:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(function () {
var id = 800;
$("#username").load("getuser.php?p="+id);
}, 5000);
</script>
<html>
<div>
<span class="account-content" id="username"></span>
</div>
</html>
This function is working on Mac Safari, the value is able to load into the span but it doesn't work on iPhone Safari. I inspected the network on iPhone, and the getuser.php API is returning correct value every 5seconds but the value doesn't show in the span.
Try to start from a document validation. The script tag outside of html is a completely invalid code.
https://validator.w3.org/nu/#textarea
Related
I wrote a JavaScript file which is only necessary for users with Firefox so I don't want other users to even load it.
<script src="js/myfile.js" type="text/javascript"></script>
Is it possible to modify this tag so it only works on Firefox?
In order to get the browser name, you can use:
navigator.userAgent.toLowerCase();
And for loading the another script, you can use the jquery way:
$.getScript("another_script.js");
Here a snippet with an example (tested with firefox and chrome).
another_script.js
$(function() {
alert("loaded");
});
main.html
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
var bwsr = navigator.userAgent.toLowerCase();
console.log(bwsr);
$(function() {
if (bwsr.startsWith("mozilla")) {
console.log("firefox");
$.getScript("another_script.js");
} else {
console.log("not firefox, nothing will be done here");
}
});
/*
*/
</script>
</head>
<body>
</body>
</html>
I know IE9 is kind of old now, but it is the lowest version of IE that I still must support in a Web application I'm building.
Anyway, while doing some DOM manipulation and testing in different browsers, I noticed that IE9 was doing something very strange. I had a <script> block in a DIV element, and when I deep-cloned that DIV element using Node.cloneNode(true), and attached the clone to the document somewhere using document.body.appendChild or document.body.insertBefore, the cloned <script> block would get executed again! No other browser exhibits this behavior.
If I'm not mistaken, <script> blocks aren't supposed to be executed when appended to the document after the document has initially loaded, am I right? If I'm correct, is this a bug in IE9?
Here is a simple HTML document where you can see this behavior in action. Create an HTML document with this code and load it up in Internet Explorer using IE9 emulation. You should see an alert popup that says "hey". Next, click the "Click Me" button, and you will see the same popup get executed again!
<!DOCTYPE html>
<html>
<head>
<title>IE9 Script Tag Bug Test</title>
<script>
function ButtonClick(){
var Elem = document.getElementById('mydiv');
var ElemClone = Elem.cloneNode(true);
document.body.insertBefore(ElemClone,Elem);
}
</script>
</head>
<body>
<div id="mydiv">
This is a DIV.
<script>
alert("hey");
</script>
</div>
<button onclick="ButtonClick();">Click Me</button>
</body>
</html>
I am trying to use jquery so that if I click anywhere on the page it will change the text of a div for the iphone browser.
I have the following:
<div id="alternative_text">traduit</div>
<script type="text/javascript">
$(document).click(function() {
$('#alternative_text').text("second text");
});
</script>
With the following in the header:
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
This works fine in my desktop browser however the moment I try this on the iphone, it does nothing.
What do I need to do to get it to work?
Thanks!
You could try targeting the body element:
$("body").click(function() {
$('#alternative_text').text("second text");
});
help me please to figure out what I'm missing.
That's my html named "test.html"
<div id="div-test">
lalalalaal
<ul>
<li>Hi</li>
<li>By</li>
</ul>
</div>
And that's another html file in the same directory, that contains this:
<div id="result"></div>
<script type="text/javascript">
$(function() {
$("#result").load("test.html");
});
</script>
But it doesn't load anything.
however, this works fine:
<div id="result"></div>
<script type="text/javascript">
$(function() {
$("#result").html("i see this text");
});
</script>
When i need to load data regularly i just create a function to load dynamically so i can either call it when i need, or when the page is done loading
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script>
function loadContent(divName,pageURL) {
$("#" + divName).load(pageURL);
}
$(document).ready(function() {
loadContent('createArea','create_login.php');
});
</script>
</head>
<body>
<div style="float:left;width:500px;min-width:500px;min-height:200px;">
<div id="createArea" name="createArea"></div>
</div>
</body>
</html>
As noted below, this will not execute locally unless you're running a WAMP server. Also the paths to the files you are loading may need to be relative if they are not residing in the same directory as the page with this code.
If you use Chrome or IE9, try monitoring XHR network calls to see what
really happens. On chrome, you monitor XHR calls by
Clicking on F12
Click network button
Click on XHR label at the very bottom of the console.
With the console open, exec the page whose code doesn't work and check if there's an actual data exchange.
Hope it helps
try this:
<div id="result"></div>
<script type="text/javascript">
$(function() {
$("#result").load("/test.html"); // add "/"
});
</script>
I'm juuuuuust trying to get an pop up displaying test when the document is ready. I've managed to get google maps working on another page but somehow this is a lot of pain.
Here's the code:
<html>
<head>
[...]
<script type="text/javascript" href="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
{literal}
<script type="text/javascript">
$(document).ready(function () {
alert ("test");
});
</script>
{/literal}
</head>
[...]
</html>
What should I do to get that popup message? I also tried copy pasting from my working jquery page without much success.
Changing <script href=...> to <script src=...> works like a charm for me.
Does you javascript is enabled in your browser ?
You can type this:
$(function() {
alert("test");
});