Hi all,
I'm trying to write a few plugins for jQuery, so as a starting point I went for the basic example shown in the documentation (here). This is the code I have, in a js file called jquery.test.js:
(function($) {
$.fn.myPlugin = function(settings) {
var config = {'foo': 'bar'};
if (settings) $.extend(config, settings);
this.each(function() {
// element-specific code here
alert('found P tag');
});
return this;
});
})(jQuery);
And here's the HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en">
<head>
<title>Plugin Test</title>
<script type="text/javascript" src="/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="/jquery.test.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('p').myPlugin();
});
</script>
</head>
<body>
<p>asdgasdgasg</p>
</body>
</html>
I'd expect this to pop up an alert for every paragraph tag in the page. However, when I load the page, nothing happens. Firebug gives me two errors:
missing ; before statement
http://playground.darthvader.com/jquery.test.js
Line 16
$("p").myPlugin is not a function
http://playground.darthvader.com/ol.html
Line 11
I'm puzzled. Can anyone see what I've done wrong here?
EDIT: It turned out there was a typo in the jQuery docs (well caught Ghommey), from which I was copying and pasting the code. I contacted the admins at the docs site, and it's now fixed.