Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Treat a span as input element

Is it possible to use a span to trigger input?

e.g.

<div class='btn'>
    <span type="submit" aria-hidden="true" data-icon="&#xe000;"></span>
</div>

I may be missing something blindingly obvious but I basically just want to use an icon font as a send button.

Thanks!

like image 225
SparrwHawk Avatar asked Jan 26 '13 22:01

SparrwHawk


People also ask

How do I change input to span on click?

First, you need to change your click handler to use live() as well. You should take note, though, that live() has been deprecated for quite a while now. You should be using on() in both cases instead. Secondly, when you replace the input with the span, you don't give the element an id.

How do you find the input field span value?

Use the textContent property to get the text of a span element, e.g. const text = span. textContent . The textContent property will return the text content of the span and its descendants. If the element is empty, an empty string is returned.

Can I use span in div?

The <span> element shows the inline portion of a document. The <div> elements show a block-level portion of a document. A div is a block-level element and a span is an inline element. The div should be used to wrap sections of a document, while use spans to wrap small portions of text, images, etc.


1 Answers

If you have a form, you can just call myform.submit()

<form name="myform" method="post" action="action.php">
    <div>
        <label for="email">E-Mail</label>
        <input type="text" id="email" name="email"/>
    </div>
    <div class="btn">
        <span aria-hidden="true" data-icon="&#xe000;" onclick="myform.submit()">Submit</span>
    </div>
</form>
like image 97
Olaf Dietsche Avatar answered Sep 29 '22 09:09

Olaf Dietsche