将跨度视为输入元素

Question

是否可以使用跨度来触发输入？

例如

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

我可能会遗漏一些令人目眩的明显但我基本上只想使用图标字体作为发送按钮.

谢谢!

Answer 1

如果你有表格,你可以打电话 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>

Answer 2

你不能放type="submit",但你可以点击它时执行一些Javascript代码.

JQuery的

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

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

    //stuff here

});

使用Javascript

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

function MyClick()
{

  //stuff here

}

SPAN作为提交按钮工作

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

现在在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
   });
}