Use label as distant button in HTML
- Breadcrumbs
- Posted at 2010-07-05 11:03 UTC / (5,213 days ago)
- No Comments
- Show map of post
Hi folks,
Did you ever had the problem, that you wanted to invoke the same action at two or more different locations on your page?
Approaches
- Replication of the form, which is no real solution
- Usage of JavaScript, which may be turned off on some computers, plain HTML is faster by default, …
Besides of these two possibilities, the not so obvious solution – at least for me – was the usage of the label tag.
Example
“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.”
Code
<input id="test_button" type="button" value="click me…" onclick="alert('thanks for clicking')" />
<label for="test_button">or do you want to click me?</label>
Conclusions
You may include as many labels as you like. An example for the usage would be the navigation on top and bottom of a form.
Tested on FF 3.6, Opera 10, Chrome 5, IE 8
Greetz,
Berny
Leave a Reply
You must be logged in to post a comment.