View Full Version : Javascript Help --- image hyerlink

03-20-2009, 06:49 AM
Ok so below is my code and I can not for the life of me remember how to use an image for they hyperlink instead of text... Can someone help me please!!!!

This javascript is to an additional file upload and limits it to three... The hyerlink in reference is to remove the additional line.

Thanks in advance.

Code in particular is

l.setAttribute("href", "javascript:removeFileInput('f"+upload_number+"');");l.className = 'remove-btn'; l.appendChild(document.createTextNode(' '))

Entire code:

<script type="text/javascript">
var upload_number = 2; function addFileInput() { if(upload_number > 3) { alert('Sorry you can only upload 3 files'); exit(0); }

var d = document.createElement("div"); var l = document.createElement("a"); var file = document.createElement("input"); file.setAttribute("type", "file"); file.setAttribute("name", "attachment"+upload_number); l.setAttribute("href", "javascript:removeFileInput('f"+upload_number+"');");l.className = 'remove-btn'; l.appendChild(document.createTextNode(' ')); d.setAttribute("id", "f"+upload_number); d.appendChild(file); d.appendChild(l); document.getElementById("moreUploads").appendChild(d); upload_number++; var i = document.createElement("IMG");

function removeFileInput(i) { var elm = document.getElementById(i); document.getElementById("moreUploads").removeChild(elm); upload_number = upload_number - 1; }// decrement the max file


Old Pedant
03-20-2009, 07:08 AM
The old-fashioned works in every browser way is to just wrap it with the <A> tag:

<a href="..."><img ...></a>

But nowadays, you could just do
<img ... onclick="...">

I'll let you translate that to your funky JS code.

p.s.: Did you consider simply creating all three upload spots ahead of time and then just setting them to
style="display: none;"
until they are needed? Or turning one back to no display when it is cancelled?

If you were using dynamic code to generate 137 of the things, doing it as you do would make eminent sense. But for only 3??

03-20-2009, 09:37 AM
But nowadays, you could just do
<img ... onclick="...">

This method is terrible for SEO and accessibility. I would suggest using <a><img /></a>.