Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 8 years ago.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Improve this question
I have a html page with a button whos onclick calls a javascript function...but I have been getting a function not defined error for two days! Can someone help?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/jquery.mobile-1.2.1.css" />
<link rel="stylesheet" href="css/jqm-docs.css"/>
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/jqm-docs.js"></script>
<script src="js/jquery.mobile-1.2.1.js"></script>
<script>
function doSomething(){
alert('this is a test');
}
</script>
</head>
<body>
<div data-role="dialog">
<div data-role="content" id = "test" data-theme="c">
$confirm
Cancel
</div>
</div>
</body>
</html>
This might be handy:
http://jquerymobile.com/demos/1.2.0/docs/pages/page-scripting.html
You need to stick your scripts within the page element:
<div data-role="page">
<script>
function doSomething(){
alert('this is a test');
}
</script>
<!-- the rest of your stuff -->
</div>
In fact i have passed personally with this error even with valide HTML all what you need to do is move all of your functions to the head element.
Here is a fiddle:
http://jsfiddle.net/WekEA/1/
To demonstate what i have said in the framework & change the NoWrapToHead to onload
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 5 years ago.
Improve this question
I am trying to get my java script file to capture the inner Html of an id in my HTML file and alert it.
here is my html code
<head>
<script type="text/javascript" src="indexjs.js"></script>
</head>
<body>
<div class="topbar">
<ul>
<li id="barmuhia">Job Muhia</li>
</ul>
</div>
</body>
the js code is
alert(GetElementById("barmuhia").innerHTML)
The actual method name is getElementById and it is in the document object.
See documentation.
Change GetElementById first letter to lower case and prefix with document - document.getElementById.
Example
alert("js file connected");
alert(document.getElementById("barmuhia").innerHTML);
<body>
<div class="topbar">
<ul>
<li id="barmuhia">Job Muhia</li>
</ul>
</div>
</body>
Updated
index.js
window.onload = function () {
// your code goes here
}
Or
<head>
</head>
<body>
<div class="topbar">
<ul>
<li id="barmuhia">Job Muhia</li>
</ul>
</div>
<script type="text/javascript" src="indexjs.js"></script>
</body>
GetElementById isn't method
Switch to getElementById() or use jQuery $("#element").html();
Hi You are missing document and using GetElementById instead of getElementById here, use below
alert(document.getElementById("barmuhia").innerHTML);
you can also use below jquery method
$("#barmuhia").html()
alert(document.getElementById("barmuhia").innerHTML);
<head>
<script type="text/javascript" src="indexjs.js"></script>
</head>
<body>
<div class="topbar">
<ul>
<li id="barmuhia">Job Muhia</li>
</ul>
</div>
</body>
i managed to solve it out through your help.
first, it was so silly of me to not realized that i had changed the content of #barmuhia to an img element. i changed it back to a normal text element but it still didn't work. i used one of the solutions provided above to put the alerts in a function which will only call after the my webpage is loaded.
window.onload = function () {
alert('js file connected')
alert(document.getElementById("barmuhia").innerHTML) }
Thank you all.
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 5 years ago.
Improve this question
Please I'm trying to knockoff a loading bar on my site, I have searched through the files, still can't find it. I also tried inspecting using google chrome, but I couldn't target the loader. Kindly help out
Click here for to visit website.
<div class="pace pace-inactive">
<div class="pace-progress" style="width: 100%;" data-progress-text="100%" data-progress="99">
<div class="pace-progress-inner"></div>
</div>
<div class="pace-activity"></div>
</div>
Remove this html construct. There also should be a javascript/css which triggers the loading bar. You can remove that too.
It's inside your head:
<script src="assets/plugins/pace/pace.min.js"></script>
<link href="assets/plugins/pace/pace.css" rel="stylesheet">
just go the HTML of your page. there from the top, search for <body> tag. Just below it you'll find this :
<div class="pace pace-inactive"><div class="pace-progress" data-progress-text="100%" data-progress="99" style="width: 100%;">
<div class="pace-progress-inner"></div>
</div>
<div class="pace-activity"></div></div>
Remove all these lines and you'll be fine
and remove these two lines in your <head> tag
<link href="assets/plugins/pace/pace.css" rel="stylesheet">
<script src="assets/plugins/pace/pace.min.js"></script>
Remove Pace library/plugin from your index.html in head section
& from assets folder inside your application.
<link href="assets/plugins/pace/pace.css" rel="stylesheet">
<script src="assets/plugins/pace/pace.min.js"></script>
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
In a page of my web, I have a textarea to write html code. How to show this html result of this textarea into a other view under this texterea.
You are looking for a WYSIWYG for angular:
Angular WYSIWYG directive
textangular
angular-redactor
angular-froala
List provided here as well: http://ngmodules.org/tags/wysiwyg
<html>
<head>
<meta name="description" content="quick edit panel" />
<meta name="viewport" content="width=device-width">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
</head>
<body>
<div class="prompt" contentEditable=true
style="padding:5px;
background-color:black;
height:28px;
color:white;
font-family:'courier new'">
write a html code <span style="background-color:blue;">here</span>
</div>
<div class="result">
write a html code <span style="background-color:blue;">here</span>
</div>
<script type="text/javascript">
$('.prompt').focus();
$('.prompt').keypress(function(event){
if ( event.which == 13 ) {
var resultado = $('.prompt').html();
console.log(resultado);
$('.result').append($('<div/>').html(resultado).text()+"<br>");
$('.prompt').html('');
$('.prompt').focus();
}
});
</script>
</body>
</html>
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 8 years ago.
Improve this question
i have this jquery code and html it is working on jsfiddle.com(http://jsfiddle.net/9rJev/) and this is the working example but when i get it to notepad++ its not working, and this is my code on notepad++
<html>
<head>
<script type="text/javascript" src="js/jquery.1.3.2.min.js" ></script>
<script type="text/javascript" src="js/jquery.1.6.4.min.js" ></script>
<script type="text/javascript" src="js/jquery-ui.min.js" ></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$('#movedown').ready(function(){
`$('#test').slideUp();`
})
$('#movedown').mouseover(function() {
$('#test').slideDown();
});
$('#movedown').mouseleave(function(){
$('#test').slideUp();
});
</script>
</head>
<body>
<div id="movedown">
<h4>yazan</h4>
<div id="test" style="background-color:lightgrey; border:2px solid grey;padding:10px;">Hello, this will slide down.</div>
</div>
</body>
</html>
but its not working on google chrome anyone have any idea what is the issu.
please help.and thanks
Change your JS to this:
$(document).ready(function(){
$('#movedown').ready(function(){
$('#test').slideUp();
})
$('#movedown').mouseover(function() {
$('#test').slideDown();
});
$('#movedown').mouseleave(function(){
$('#test').slideUp();
});
});
And also remove all but 1 jquery reference. Note you need to include the ready function, and you had some odd characters around $('#test').slideUp(); which caused JS errors. After these minor changes your code performed fine for me.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 8 years ago.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Improve this question
I have these number of <a href />links in a HTML page:
<a ...>
<a ...>
.....
<a ...>
What I want is on the click of each link I have to show a text file on same html page.
a text file can be shown in a textarea or iframe.
How can I accomplish that?
.........EDIT..............
correct code
<html>
<head>
<title>Ajax Test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("a").click(function(e){
e.preventDefault();
$.get( $(this).attr("href") ).done(function(e){
$("textarea").html(e);
});
});
});
</script>
</head>
<body>
foo bar<br>
<textarea></textarea>
</body>
</html>
You can use AJAX to get the text file data from the server, then put it into the text field.
Demo: http://jsfiddle.net/DerekL/63BLB/
$("a").click(function(e){ //select all <a>
e.preventDefault(); //remove default link effect
$.get( $(this).attr("href") ) /*AJAX (using jQuery)..
..and insert the URL of text file*/
.done(function(e){ //When it is downloaded,
$("textarea").html(e); //shows it in <textarea>
});
});
If you are new to jQuery, you may want to check out their documentation, especially $.ajax. :)
Note: You can only fetch text files in the same origin.
Note 2: The code above is written using jQuery. If you do not want to use jQuery, you will have to do the whole native new XMLHttpRequest thing.