search
HomeBackend DevelopmentPHP ProblemHow to press enter without submitting the form and submit the form in php

When we write a form, we often encounter such a situation: when the user presses Enter in the input box, the form will be automatically submitted, which can easily cause problems such as misoperation and information loss.

This article will introduce to you how to implement two methods of pressing enter without submitting the form and submitting the form in PHP, so as to better meet the needs of users.

1. Enter without submitting the form

1.Use JavaScript to achieve
We can use JavaScript to prevent the form from automatically submitting when the user presses the Enter key to the server. The code is as follows:

<script>
    document.onkeydown = function(event) {
        var e = event ? event : (window.event ? window.event : null);
        if (e.keyCode == 13 && e.target.tagName.toLowerCase() != &#39;textarea&#39;) {
            //阻止表单提交
            return false;
        }
    }
</script>

2. Use jQuery to implement

In addition, we can also use the preventDefault() method in jQuery to prevent form submission. The code is as follows:

<script>
    $(document).on(&#39;keydown&#39;, function(event) {
        if (event.keyCode == 13 && event.target.tagName.toLowerCase() != &#39;textarea&#39;) {
            event.preventDefault();
        }
    });
</script>

2. Press Enter to submit the form

If we want the user to automatically submit the form by pressing the Enter key after entering the information, we can This is achieved in two ways.

1. Use JavaScript to implement

We can listen to the event of the Enter key in the text box and trigger the form submission event when the user presses the Enter key. The code is as follows:

<script>
    function submitForm() {
        document.formName.submit(); //提交表单
    }

    document.getElementById(&#39;input&#39;).onkeydown = function(event) {
        var e = event ? event : (window.event ? window.event : null);
        if (e.keyCode == 13) {
            submitForm();
        }
    }
</script>

2. Use the form attribute of HTML5

In HTML5, we can use the form attribute to bind the input box to the form, so that when the user presses the Enter key in the input box, the form will Submit automatically. The code is as follows:


         

In this example, the form attribute of the input box points to the form ID, and the form attribute of the submit button also points to the form ID. In this way, when the user presses the Enter key, the content in the input box will be submitted to the server.

Summary

When writing web forms, we must take into account the user's behavioral habits and needs to improve the user experience. This article introduces how to implement two methods of pressing Enter without submitting the form and pressing Enter to submit the form in PHP. I hope this article can provide you with some help.

The above is the detailed content of How to press enter without submitting the form and submit the form in php. 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

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

WebStorm Mac version

WebStorm Mac version

Useful JavaScript development tools

SublimeText3 English version

SublimeText3 English version

Recommended: Win version, supports code prompts!

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

PhpStorm Mac version

PhpStorm Mac version

The latest (2018.2.1) professional PHP integrated development tool

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.