Question

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!

Answer 1

You can’t put type="submit" , but you can execute some Javascript codes when you click on it.

JQuery

<span id="mySpan"> </span>

$("#mySpan").click(function(){

    //stuff here

});

Javascript

<span id="mySpan" onclick="MyClick()"> </span>

function MyClick()
{

  //stuff here

}

SPAN working as a Submit Button

<input type="text" id="usernameInputField />
<input type="email" id="emalInputField />
<span id="mySpan" onclick="Register()"></span>

Now in Javascript..

function Register()
{
   //First you need to do some validation
   var username = document.getElementById("usernameInputField").value;
   var email = document.getElementById("emailInputField").value;
   //Password, Gender, etc...
   //Then start doing your validation the way you like it...
   /*if(password.length<6)
     {
         alert("Password is too short");
         return false;
     }
   */
   //Then when everything is valid, Post to the Server
   //This is a PHP Post Call
   $.post("Register.php",{ username:username,email:email } ,function(data) {
       //more codes
   });
}