JavaScript web form function communication full of practical information

1. Introduction

Earlier we talked about the front-end display issue. Now let's return to the previous content and enrich some form operations.

2. Main text

Through our previous content, I believe everyone is already very familiar with the environment configuration in idea, so now we

I will not talk about the environment configuration anymore. Students who still don’t understand can find relevant content in my first article.

Then directly as shown in the figure:

This is what we did first. We ran

After entering the account and password, it will be displayed on this web page. This is not something we want to see.

So we just need to add method=" post" to the form

method=" post" is encrypted submission. We write it. If we don't write it or get it, it will be publicly submitted. After running

At this time, the account and password will not be displayed after submission.

In fact, non-encrypted submission is very common in our daily searches as shown in the figure:

We didn't see any results after submitting, which was very uncomfortable, so we

   <script type="text/javascript">
        function submit() {
         alert("Submission successful")
        }
    </script>

The name after action is arbitrary, and the content displayed in the alert is also arbitrary. We also need to

Add this function

After running, we can get it after entering and clicking Submit, and then click OK to submit successfully

If we also want to have a prompt at the reset point, the principle is the same

The reset button is there:

Note that the functions written must correspond:

After running: Click Reset

Click OK to successfully clear.

When we enter our account and password, we feel that the box is too large or too small, so we can control the length of the text box

You can use size to control

The account is controlled by size, and the password is the default length. Let's compare them.

The length is obviously different, so we control the length of the text box

Then we think that controlling the length of the text box is far from enough. For example, we want to set a limit of how many digits the text box can contain. We can use maxlength="" to limit the length of the text box.

After running it, I checked it and found that it was indeed possible. After the fifth digit, it could not be lost.

maxlength literally means the maximum length, which is very easy to remember.

Multi-line text box input: textares, can enter a lot of information

This is the end of this article about JavaScript web form functions. For more relevant JavaScript web form content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future!