JS:
document.getElementById("terminal_text").innerHTML = "hello";
HTML:
<p id="terminal_text"></p>
<script type="text/javascript" src="js1.js"></script>
1st line inside js file.
2nd line and 3rd line(inside head) in html file.
I'm trying to use a javascript file to print to a paragraph tag using the ID and it's not printing. Any ideas? Thank you ! :)
Put the script tag after your element in the body:
<body>
.. stuff
<p id="terminal_text"></p>
<script type="text/javascript" src="js1.js"></script>
.. more stuff
</body>
You must place the <script> tag after the <p> tag, otherwise you <p> tag does not exist when your javascript code runs.
If you don't want to do this you can execute your code on the load event when your page is fully loaded:
window.addEventListener('load', function () {
document.getElementById("terminal_text").innerHTML = "hello";
});
Related
I am defining the source of a .js file and attempting to call a function from that file in the same tag, as follows:
<script type="text/javascript" src="jsFunctionTest.js">
testMethodCall();
</script>
The .js file just contains:
function testMethodCall(){
window.alert("Hello there");
}
This doesn't work, I don't see the alert.
However, if I change the tag to two tags, as below, then it works:
<script type="text/javascript" src="jsFunctionTest.js"></script>
<script type="text/javascript">
testMethodCall();
</script>
This seems pretty messy. Is there any reason the first one doesn't work?
script elements can have a src attribute or content, but not both. If they have both, the content is ignored (the content is considered "script documentation," not code).
You cannot register an external file and use the content in it, both at a time inside <script> tags. Only either one is allowed.
Whenever I put the script in another file in the same folder as script.js, it doesn't run. It only runs when I include my code in the script tag.
I tried it out with this simple jquery code. Whenever the third script tag is uncommented, it works, but the set up I have right now doesn't run.
HTML
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" scr="script.js"></script> // <!-- doesn't run -->
<!--script> // <!-- only runs inside the html file -->
$(document).ready(function(){
$('p').click(function(){
$(this).hide();
});
});
</script-->
</head>
<body>
<p>Click to hide.</p>
</body>
</html>
script.js
$(document).ready(function(){
$('p').click(function(){
$(this).hide();
});
});
Does anyone know what I am doing wrong?
scr is not src. Use a validator to make sure you haven't misspelt attribute names.
Your jQuery code is being duplicated inside the script.js file and .html file so that's why the code won't run.
Remove the jQuery code from the .html file and your code will run. Also like was mention above replace scr with src in your .html file.
Finally, I'd replace the code in your script.js file with the new code listed below as click(function(){} is older code:
$(document).ready(function(){
$("p").on("click", function(){
$(this).hide();
});
});
I am trying to load php code into div tag to show the results but the below code doesn't work for.
Can anyone please help me...to resolve this
my code is below:
<html>
<head>
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
$("document").ready(function()
{
$("#myDiv").load("refreshing.php");
}
</script>
</head>
<body>
<div id='myDiv'> </div>
</body>
</html>
Change script tag to this
<script type="text/javascript">
$(document).ready(function()
{
$("#myDiv").load("refreshing.php");
});
</script>
i.e. you're missing ); at the end
Also, document should not have quotes on it
You cannot load php code .load() because as the web server gets the GET request with .php, the request is passed to PHP interpreter which will execute the PHP script and return the result of the php script instead of code. So what you can do is in your PHP script, do a echo of all the code that you want to display. Or, you can define custom rule in your Apache configuration.
You've forgotten the closing bracket:
$("document").ready(function(){
$("#myDiv").load("refreshing.php");
});
I came accross this html multiple file upload tutorial: http://robertnyman.com/2010/12/16/utilizing-the-html5-file-api-to-choose-upload-preview-and-see-progress-for-multiple-files/
I'm new to web programming enough to not being able to understand how to make a code from the two sections of the 'complete code' in this tutorial, which basically are:
A. Some html code:
<h3>Choose file(s)</h3>
<p>
<input id="files-upload" type="file" multiple>
</p>
<p id="drop-area">
<span class="drop-instructions">or drag and drop files here</span>
<span class="drop-over">Drop files here!</span>
</p>
<ul id="file-list">
<li class="no-items">(no files uploaded yet)</li>
</ul>
B. And some javascript:
(function () {
var filesUpload = document.getElementById("files-upload"),
dropArea = document.getElementById("drop-area"),
fileList = document.getElementById("file-list");
function uploadFile (file) {
[etc]
I recognize the code, but I don't understand where a part of code beginning with (function () is supposed to go into my code.
So my question is: how should the javascript part be placed in my code.
[Edit]
Thanks for your complementary answers!
Either just before the </body> tag, between a <script type="text/javascript"></script> tag like this:
<body>
<!-- other stuff -->
<script type="text/javascript">
(function () {
// this is your function's core
})();
</script>
</body>
Or within the <head></head> tag, also between a <script type="text/javascript"></script>, but you have (probably) to wait until the DOM correctly loaded. For example, using jQuery:
<head>
<!-- other stuff -->
<script type="text/javascript">
$(function() {
(function () {
// this is your function's core
})();
});
</script>
</head>
Or even within an external JavaScript file, where you'll also have (probably) to wait until the DOM correctly loaded. For example, once again using jQuery:
file myScripts.js
$(function() {
(function () {
// this is your function's core
})();
});
file myDocument.html
<head>
<!-- other stuff -->
<script type="text/javascript" src="/path/to/myScripts.js"></script>
</head>
Javascript is placed inside onClick, onMouseOver, etc. attributes, as well as inside <script type="text/javascript"> tags.
They can be anywhere inside the <head> or <body> tags (place it after the elements you are accessing, so that they load).
w3 Schools has a Javascript reference to get you started.
Create a file with .js extension so yourFile.js.
Put your java-script code in it...
At the end of HTML file place this inside:
<script src="yourFile.js"></script>
Make sure your js is in the same directory as is your html...
Just put the javascript inside <script></script> tags after your upload form.
The post you linked to has a complete working demo of the code it describes which can be found here:
http://robertnyman.com/html5/fileapi-upload/fileapi-upload.html
A good way to experiment with this kind of code snippet is to paste the required section into a tool like JSFiddle
Since the code includes getElementById but nothing like window.onload or any other deferring tactic, it MUST be placed AFTER the form you want it to affect. To be on the safe side, you can place it in a <script> tag immediately before </body>.
I have two files screen.html and db_fun.js.I have declared a variable at just the beginning as follows:
db_fun.js
var name = "abc";
now i tried to access this variable in the screen.html file as follows
screen.html
<html>
<body>
<form name = "screen" action = "db_fun.js">
<p> <script>document.write(name);</script> </p>
</form>
</body>
<script src="db_fun.js" type="text/javascript" />
</html>
it doesn't print nethn. Y so?
add this to the head
<script type="text/javascript" src="db_fun.js"></script>
I think that you should move
<script src="db_fun.js" type="text/javascript" />
In the head of the page. I.e. before document.write.
Because in the moment where you are trying to print 'name', the variable is still not created. Also I think that it is not a very good practice to use document.write to add content to your page. Try using jQuery or some other library. For example:
$(document).ready(function() {
$("p").html(name);
});
That's because you are inserting your JavaScript in the page footer. You have to firstly load your javascript file into your web site (in the head section for example) and then use your variable.