/Ugly/ + 'JavaScript'

A place for ugly, silly, or just-plain-crap JavaScript.

Links plus

Working on a recent project I kept coming across anchor tags like this:

<a href="#" onclick="visit_url(<?php echo $url; ?>)">

I was really curious as to what visit_url() would do, eventually I found it:

function visit_url(url) {
    window.location = url;
Posted by Gavin Logan (@tamewhale) on 13 Oct 2011 | linky

How NOT to implement styled checkboxes/radio buttons

While rescuing a project started by a straight-from-university intern, I came across his very enterprisy approach on creating nice and fancy styled checkboxes and/or radio buttons…

<div id="checkbox_unchecked_s" style="background: url('/./images/stories/checkbox/unchecked.png');display:none;width:31px;height:31px;" onclick="this.style.display = 'none';
    	document.getElementById('checkbox_checked_s').style.display = 'inline-block';
        document.getElementById('checkbox_unchecked_m').style.display = 'inline-block';
        document.getElementById('checkbox_checked_m').style.display = 'none';
        document.getElementById('checkbox_unchecked_l').style.display = 'inline-block';
        document.getElementById('checkbox_checked_l').style.display = 'none';
        document.getElementById('form_groesse').value = 's';"  ></div>
<div id="checkbox_checked_s" style="background: url('/./images/stories/checkbox/checked.png');display:inline-block;width:31px;height:31px;"  ></div>

Needless to say, this appeared multiple times on the same page… copy&pasted…

Posted by David Wosnitza (_druu) on 27 Sep 2011 | linky

Useless use of document.write

While reviewing some enterprise JavaScript for a client I came across a couple of these inside if clauses:

document.write("<scr"+"ipt language=javascript>var some_var = 'some value'<" + "/scr"+"ipt>");

There’s definitely some room for improvement here. For one, the language attribute on the <script> element is obsolete in HTML; it can safely be omitted.

document.write("<scr"+"ipt>var some_var = 'some value'<" + "/scr"+"ipt>");

Next, there’s no need to concatenate the string like that — you can just write it out all at once, as long as you escape the </script> end tag:

document.write("<script>var some_var = 'some value'<\/script>");

There are only few good reasons to ever use document.write. Writing out <script> elements can be one of them, but in this case? Not so much. Believe it or not, the intention of this code snippet was to create a global variable. (Polluting the global scope with variables is something that should be avoided whenever possible; however, in this case, the variable really needed to be global.)

Of course, there’s a better way to do that in client-side JavaScript:

window.some_var = 'some value';
Posted by Mathias Bynens on 20 Sep 2011 | linky

changeTheClass, with bonus IE workaround

I’ll let this one speak for itself:

function changeTheClass(theElement, theClass)
		document.getElementById(theElement).setAttribute("className",theClass); //IE workaround
Posted by James on 19 Sep 2011 | linky

No xss please

A validation rule applied to all text inputs, politely protecting against xss attacks.

$.validator.addMethod("script", function (value, element) {
	var v = value.toLowerCase();
	if (v.indexOf("<script") >= 0 || v.indexOf("<xss") >= 0) {
		return false;
	} else {
		return true;
}, "Please do not enter JavaScript into this area.");
Posted by twalker on 18 Sep 2011 | linky

Subscribe or follow @UglyJS!
Fork then send a pull request to contribute.