Sample code
<div class='credit'>
Copy blabla
</div>
in the code above I will add content and links
$(document).ready(function(){
$('.credit').append(' credit by blabladot');
});
but I tried and did not work, how the code is correct?
You need to make sure you add the latest version of jQuery library in your HTML's <head></head> section as follow:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
Also, make sure that other jQuery files or scripts are included after the above link.
Working fiddle Demo
You have forgotten to include jQuery
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
Working jsFiddle here.
If you are using it in a blogger template, check this. I would recommend you to take a look in your developer console (in chrome) or firebug (in firefox) for any javascript errors and mention them in the question.
Related
I found a good example here but I had no idea how to use the code.
First, I tried the code in Blogger, nothing showed.
Second, I tried the code in jsfiddle, nothing showed too.
Third, I exported the code and pasted it in Blogger, nothing showed. >:(
The code only works when I use the exported .html and the online sample.
http://codepen.io/ccrch/pen/yyaraz
Does Blogger not support the code or do I use it wrongly?
Have you remembered to include jquery?
This code depends on the Jquery javascript framework.
Simply include the jquery script above the script like so:
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="js/yourScriptHere.js"></script>
You must also place script tags to open and close the script. The JS code on the CodePen link does not include those tags.
Script opening and closing tags look like this:
<script type="text/javascript">
</script>
In between those tags, you'd copy and paste the JavaScript from CodePen i.e.
<script type="text/javascript">
$('.tile')
// tile mouse actions
and so on...
</script>
Also copy and paste this link to the latest jQuery script, as BlitZz mentioned:
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
If after doing that, the image does not zoom, please paste a link to your live page.
When i try to use AngularJs with SemanticUI.js, the console says
Uncaught ReferenceError : jQuery is not defined
Here is my example of implementation :
<html>
<head>
<!-- I'm head of the document -->
</head>
<body>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/angular.min.js"></script>
<script src="assets/js/semantic.min.js"></script>
<!-- My own script place right here -->
</body>
</html>
Am i doing the right way? I've tried to swap the script position, but my code still doesn't work.
I think the problem in the semantic.min.js, maybe the $ has been replaced by angular or something that i don't know, because when i try to remove the semantic.min.js, no one appears in the console.
I have also try another solution that i've found in stackoverflow, but yes, it still not works.
Only additional information :
AngularJs version 1.5.5
JQuery version 2.2.4
Semantic version 2.1.8
Can anyone give me a solution?
I think it's jQuery problem.
That error can only be caused by one of three things:
Your JavaScript file is not being properly loaded into your page
You have a botched version of jQuery. This could happen because someone edited the core file, or a plugin may have overwritten the $ variable.
You have JavaScript running before the page is fully loaded, and as such, before jQuery is fully loaded.
Please take a look in here for more detail.
JQuery - $ is not defined
just add a slash
<script src="/assets/js/jquery.min.js"></script>
<script src="/assets/js/angular.min.js"></script>
<script src="/assets/js/semantic.min.js"></script>
Oops, sorry, my bad.
I found the problem, it's not the jQuery problem, it's Electron problem.
Because my project use Electron, so the solution is right here :
Electron : jQuery is not defined
Got a Problem with my Bootstrap. It seems as if the JS is not working correctly somehow, because even the easiest examples of popovers dont work. (http://jsfiddle.net/weuWk/363/)
This little piece of code which works correctly on JSFiddle, is just creating a Button(w/o hover functionality) if used in my source code.
The Modal-Plugin is actually working, so this should mean that i include the js files in the right way. I will copy it anyway:
<script src="js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
jQuery needs to be included before bootstrap's javascript, as bootstrap is just jQuery "plugins".
You should Include in this order:
jQuery
Bootstrap
Your Javascript
EDIT: Try this right before the closing body tag
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
$(function(){
$('#test').popover();
});
</script>
Also, the console is your friend. Check and make sure there are no errors.
SOLVED:
Solution: > Right order of Includes > fixing errors i got from my js console.
I need to use jquery in a custom login form that I am creating but i cant find a way to do it.
I have tried including the script tag but nothing happens:
<script src="/cognos/ps/login/jquery-2.0.3.min.js"></script>
I can successfully include custom css in the login xhtml page but javascript of any kind.
Standard javascript works though. Adding something like:
<script>
alert("I am here!");
</script>
works. I am adding the necessary noConflict() statement and everything that various posts suggest but no luck. Note that all relative posts i have found explain how to use jQuery in a cognos report html, not in login screen.
<script>
document.body.appendChild(document.createElement("script")).setAttribute("src","http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js")
</script>
I ran a test where I included the script tag towards the end of the file, similar to example one in this document:
http://www.ibm.com/developerworks/data/library/cognos/security/cognos_bi_platform/page546.html
Here's the example code:
<script type="text/javascript" src="/ibmcognos/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
console.log("JQuery is ready");
});
</script>
This works for me.
Got a Problem with my Bootstrap. It seems as if the JS is not working correctly somehow, because even the easiest examples of popovers dont work. (http://jsfiddle.net/weuWk/363/)
This little piece of code which works correctly on JSFiddle, is just creating a Button(w/o hover functionality) if used in my source code.
The Modal-Plugin is actually working, so this should mean that i include the js files in the right way. I will copy it anyway:
<script src="js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
jQuery needs to be included before bootstrap's javascript, as bootstrap is just jQuery "plugins".
You should Include in this order:
jQuery
Bootstrap
Your Javascript
EDIT: Try this right before the closing body tag
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
$(function(){
$('#test').popover();
});
</script>
Also, the console is your friend. Check and make sure there are no errors.
SOLVED:
Solution: > Right order of Includes > fixing errors i got from my js console.