Captcha Refresh 1.0
Created Friday 19th of September 2008 by Andreas Lagerkvist
Copyright © 2008 Andreas Lagerkvist (andreaslagerkvist.com)
Please have a look at the "Other Resources" for bug reports or further help on jQuery. Do not post bug reports or feature requests as comments to unrelated articles. If bug reporting on bugtracker.a-framework.org fails, e-mail me.
What it Does
If you use a so called CAPTCHA-image on your site then you can use this plug-in to allow users to click your CAPTCHA in order to generate a new random string - provided your CAPTHA-script generates a random image every time it is called.
How to Use
jQuery(document.body).captchaRefresh({src: '/captcha.png'}); Would make all images with '/captcha.png' as their source in the document clickable.
Run Captcha Refresh on a parent-element of the captcha image(s). Running it on document.body affects every CAPTCHA-image in the document.
Example
Example Code
HTML
<div id="jquery-captcha-refresh-example">
<img src="/aFramework/Utils/Captcha.php" alt="" />
</div>
JS
jQuery('#jquery-captcha-refresh-example').captchaRefresh({src: '/aFramework/Utils/Captcha.php'});
Source Code
jQuery.fn.captchaRefresh = function (conf) {
var config = jQuery.extend({
src: '/captcha.png',
title: 'Can\'t see what it says? Click me to get a new string.'
}, conf);
return this.each(function (x) {
jQuery('img[src^="' + config.src + '"]', this).attr('title', config.title);
jQuery(this).click(function (event) {
var clicked = jQuery(event.target);
if (clicked.attr('src') && clicked.attr('src').indexOf(config.src) === 0) {
var now = new Date();
var separator = config.src.indexOf('?') == -1 ? '?' : '&';
clicked.attr('src', config.src + separator + now.getTime());
}
});
});
};
