This is my first time using lightbox which uses jquery framework. But when I paste jQuery and Lightbox javascript files into my html page, my current javascript code doesn't work properly. Is the way I set them up wrong? Thank you. This is the order I put my js files
the error I got is:
Uncaught TypeError: Object [object Object] has no method 'dispatchEvent' prototype.js:5734
Edit:
<script src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js" type="text/javascript"></script>
<script src="random.js" type="text/javascript"></script>
<script src="js/jquery-1.7.2.min.js"></script>
<script src="load-poll.js" type="text/javascript"></script>
<script src="js/lightbox.js"></script>
And this is the beginning of my own js file as the page loads:
var POLL_WIDTH = 200;
document.observe("dom:loaded", function() {
if ($("favChar")){
fetchPoll("favChar");
}else if ($("favVoice")){
fetchPoll("favVoice");
}else if ($("CMTvote")){
fetchPoll("CMTvote");
}else if ($("BLdesign")){
fetchPoll("BLdesign");
}
});
Try using this
$(function() {
// your init code
});
instead of
document.observe("dom:loaded", function() {
// your init code
});
Related
//the jQuery file and the location
<script src="C:/xampp/htdocs/AnasCourse/BootStarp/jQ.js"></script>
//i even tried this one
<script type="text/javascript" src="file:///C:/xampp/htdocs/AnasCourse/BootStarp/jQ.js"></script>
// Simple code in jQ.js file :
<script>
$(document).ready(function(){
$("p").hide();
})
</script>
//and the result from the Console is:
Uncaught ReferenceError: $ is not defined
<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
I think you not include the jQuery file first.
I have two file:
html2canvas.js
function html2canvas(){
}
myid_print.js
(function ($) {
$(document).ready(function() {
//I want to call html2canvas function here
html2canvas();
});
})(jQuery);
I already included both files in my html but after running the code above, the console shows an error saying:
Uncaught ReferenceError: html2canvas is not defined
How will I call the function from inside my second file?
Try implementing your Client side code as :
<head>
....
<script src="html2canvas.js" type="text/javascript"></script>
<script src="myid_print.js" type="text/javascript"></script>
....
<head>
<body>
...
<script type="text/javascript">
function_from_myid_print();
</script>
...
</body>
Inside which you can call html2canvas();
This will surely help you.
For more details refer links:
https://stackoverflow.com/a/3809896/4763053 and https://stackoverflow.com/a/25963012/4763053
Try put your JS script at the bottom of your HTML page.
I am using jquery for focus of tabs. When i used :
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
in my jsp then the window.load function works good, but when i downloaded jquery.min.js and added in js folder.
<script type="text/javascript" src="jquery.min.js"></script> like this.
Now window.load function is not working.
<script type="text/javascript">
$(window).load(function() {
alert('Hello');
if($("#updatetemp").val()=="TRUE"){
$("#update_link").click();}
});
</script>
I found out the way to use JQuery locally..
jQuery(window).bind("load", function($) {
var msgtemp= jQuery("#updatetemp").val();
if(msgtemp=="TRUE"){
jQuery("#update_link").click(function() {
}).click();
}
});
Instead if $ symbol i just used jQuery attribute and it worked.
<script type="text/javascript" href="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="/stylesheets/style.css">
At the end of the page, there are the following scripts:
Case 1: no error, but "hello" was not printed out on console
<script>
(function() {
console.log("hello");
});
</script>
Case 2: I got an error: "Uncaught ReferenceError: $ is not defined"
<script>
$(document).ready(function() {
console.log("hello");
});
</script>
Can you tell me why I got these errors and how I can fix them? Thanks
You must use src instead of href in the <script> tags.
Case 1: You're defining the function, but never calling it. You need to put a pair of parentheses after the expression:
(function() {
console.log("hello");
})();
Case 2: The correct syntax for <script> tags is src=URL, not href=URL.
change href to src
In js we use src and in css we use href
<script type="text/javascript" href="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
change to
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
1) Maybe you are calling your jquery script before loading the jQuery library.
2) Load your jquery script with src instead of href in the <script> tag.
Maybe you are not loading jquery on your page, try checking if there are any failed to load resource errors on your console..hope this helps
3) To know if jquery is working in your website for sure, try this but i hope the above two will solve the issue:
(function() {
if (window.addEventListener) {
// Standard
window.addEventListener('load', jQueryCheck, false);
}
else if (window.attachEvent) {
// Microsoft
window.attachEvent('onload', jQueryCheck);
}
function jQueryCheck() {
if (typeof jQuery === "undefined") {
// No one's loaded it; either load it or do without
}
}
})();
I am using jquery round corner plugin in lifray theme in order to add round corner functionality in all kind of browsers, including IE6 to IE8. i have included the jquery round corner plugin in portla_normal.vm like this :-
<head>
<title>$the_title - $company_name</title>
<script type="text/javascript" src="/html/js/jquery/jquery.js"></script>
<script type="text/javascript" src="$javascript_folder/jquery_roundcorner.js"></script>
<script type="text/javascript" src="$javascript_folder/jquery.corner.js"></script>
$theme.include($top_head_include)
</head>
This is my jquery_roundcorner.js file, when i see on console of the browser getting the error in this file like below.
$(document).ready(function() {
$('#navigation li').corner("round 6px");
$('#navigation a').corner("round 6px");
});
I am geting following error on browser console:
Uncaught TypeError: Object #<Object> has no method 'corner'.
Can any one help me how to resolve this?
<head>
<title>$the_title - $company_name</title>
<script type="text/javascript" src="/html/js/jquery/jquery.js"></script>
<script type="text/javascript" src="$javascript_folder/jquery.corner.js"></script>
<script type="text/javascript" src="$javascript_folder/jquery_roundcorner.js"></script>
$theme.include($top_head_include)
</head>
alter the load javascript order!
you have to make sure the jquery plugin is first loaded!
in my jquery_roundcorner.js i have replaced the above code with the following code. Actually in velocity file also $ is used, there may be conflicts. so lastly i tried this, its working now.
var jq=$.noConflict();
jq(document).ready(function(){
alert('hello alert1 ');
jq('#navigation li').corner("round 6px");
jq('#navigation a').corner("round 6px");
alert('hello alert3 ');
});