Home >Web Front-end >HTML Tutorial >Example of how to use images to replace submit buttons in html

Example of how to use images to replace submit buttons in html

黄舟
黄舟Original
2017-07-22 14:07:123980browse

1. Use images instead of submit buttons

When there is only one submit button, it can be easily implemented without adding an event function. The code is:

<input type = "image"&#39; name = "..." src = "url" width= “” height = “”  border = “”>

Except that the label is changed to input type = "image", other attributes are the same as those of the a1f02c36ba31691bcfe87b2722de723b tag.

2. Use pictures to replace all form buttons

The picture format that replaces the submit button is

<input type = "image" name = "..." src = "..."inclick ="document.foormName.submit()">

The code picture format that replaces the reset button is:

<input type = "image" name ="..." src = "..." onclick = "document.formName.reset()">

Note: fromName here is the name attribute of the form

3. Form submission verification:

<script>
function checkdate(){
//取得输入数据
userName = document.RedForm.userName.value
userEmail = document.RedForm.userEmail.value
//如果没有输入名字
if(userName== ""){alert("请输入名字");
document.RedForm.userName.focus();
return false;
}else{
//如果没有输入Email,或者Email地址错误(不含@)
if(userEmail == "")||(userEmail.indexOf("@")== 1)){alret("请输入Email地址");
document.RedForm.userEmail.focus();
return false;
}else return true;
}
}
</script>

4. Submit the form with any element

through onclick = “document. from.submit()" to submit the form, and use onclick = "document.from.reset()" to reset the form, this way. Any element can submit the form.

The above is the detailed content of Example of how to use images to replace submit buttons in html. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn