Home Web Front-end JS Tutorial jQuery implements automatic display and hiding of forms according to type_jquery

jQuery implements automatic display and hiding of forms according to type_jquery

May 16, 2016 pm 04:08 PM
jquery show form hide

jquery implements form animation switching based on radio buttons. I wrote it yesterday. I feel it has made a lot of progress compared to the js/jquery I wrote when I first started learning. . It is possible to streamline the code while maximizing scalability.

html

Copy code The code is as follows:


                   
                   

                   

                   
               

               

                   
                   

                       
                   

                   
               

               

                   
                   

                       
                   

                   
               

               
                js

Copy code The code is as follows:
//Automatically show and hide forms based on type
            var input_type=$('input[name=type]');
               function typeChangeHandle(){
            var ctypes=$('.ctype');
              var type=$(this).val();
              var hideCtypes=ctypes.filter(':not(.ctype' type ')').slideUp(500,function () {
$('.ctype' type).slideDown(500);
                });
            }
             typeChangeHandle.apply(input_type);
​​​​​​ input_type.on('change',typeChangeHandle);
                input_type=null;

The above is the entire content of this article, I hope you all like it.

Statement of this Website
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

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to hide WeChat friends without blocking or deleting them? How to hide WeChat friends without blocking or deleting them How to hide WeChat friends without blocking or deleting them? How to hide WeChat friends without blocking or deleting them Mar 13, 2024 pm 07:19 PM

How to hide WeChat friends without blocking or deleting them? Many users want to hide some friends but don’t know how to do it. Let this site carefully introduce to users how to hide WeChat friends without blocking or deleting them. Methods to hide WeChat friends without blocking or deleting Method 1: 1. First open the WeChat software, find the address book on the WeChat page, and click "My". 2. Then we enter the settings page. 3. Find the “Privacy” option and click on it. 4. Then click "Don't let him see". 5. Go to the Do Not Let Her View page and click "+" to check the friends you want to hide.

How to hide works in Douyin short videos How to hide personal video works How to hide works in Douyin short videos How to hide personal video works Mar 12, 2024 pm 12:49 PM

There are many short video works provided in the Douyin short video app software. You can watch them as you like, and they are all permanently provided free of charge. Different types of live video channels are open, and all video content is original, with Give everyone the most satisfying way to watch. Enter your account to log in online, and a variety of exciting short videos will be pushed, which are accurately recommended based on what everyone watches every day. You can also enter the live broadcast room to interact and chat with the anchor, making you feel more happy. Works uploaded by individuals can also be hidden. It is very simple to set up with one click. You can see wherever you swipe. Swipe up and down to see the real-time comments of countless netizens. You can also share daily life dynamics. Now the editor has detailed online Douyin short videos. Users push for ways to hide personal video works. First open Douyin short video

How to hide Smart Island on Xiaomi Mi 14? How to hide Smart Island on Xiaomi Mi 14? Mar 18, 2024 pm 03:40 PM

In addition to the amazing hardware configuration and excellent functions, Xiaomi Mi 14 also hides a fascinating place - Smart Island. Here, users can enjoy personalized customization and unlimited creative mobile phone experience. But not everyone likes this feature, so how does Xiaomi Mi 14 hide Smart Island? Let’s find out together. How to hide Smart Island on Xiaomi Mi 14? 1. Open the settings application of Xiaomi 14 mobile phone. 2. Scroll to find the "Features" option and click to enter. 3. Find the "Hide Smart Island" option on the features page and turn it on. 4. After confirming that hiding the Smart Island is turned on, return to the desktop and you will see that the Smart Island has been hidden.

Detailed tutorial on hiding works on Douyin Detailed tutorial on hiding works on Douyin Mar 25, 2024 pm 03:11 PM

1. First click [+] to shoot. 2. Then click the check mark in the lower right corner to confirm the completion of shooting. Click] Next[, 3. Click [Who can see]. Just select [Private]. Scenario 2: The work has been taken. 1. Click [Me] and select [Work]. 2. Click the [three dots] logo on the right. 3. Swipe left to find [Permission Settings], 4. Click [Set as Private].

How to deeply clean the hidden junk on your phone (completely remove junk from your phone's memory) How to deeply clean the hidden junk on your phone (completely remove junk from your phone's memory) Jun 01, 2024 am 09:29 AM

Mobile phones have become an indispensable part of our daily lives, with the continuous advancement of technology and the popularity of smartphones. These junk files take up valuable storage space, and over time, a large amount of hidden junk will accumulate in the phone and cause the performance of the phone to degrade, however. Knowing how to deeply clean hidden junk on your phone has become essential knowledge for every mobile phone user. 1. Find and clear useless application caches 2. Delete applications that are no longer used 3. Clean photo and video cache 4. Thoroughly clean temporary files and download folders 5. Organize and clean contact and text message records 6. Clean system cache 7. Uninstall useless system applications 8. Clean browser cache and history 9. Delete invalid music and audio files 10. Optimize mobile phone file system

jQuery Tips: Quickly modify the text of all a tags on the page jQuery Tips: Quickly modify the text of all a tags on the page Feb 28, 2024 pm 09:06 PM

Title: jQuery Tips: Quickly modify the text of all a tags on the page In web development, we often need to modify and operate elements on the page. When using jQuery, sometimes you need to modify the text content of all a tags in the page at once, which can save time and energy. The following will introduce how to use jQuery to quickly modify the text of all a tags on the page, and give specific code examples. First, we need to introduce the jQuery library file and ensure that the following code is introduced into the page: &lt

How to hide watch list in bilibili How to hide watch list in bilibili Mar 01, 2024 pm 01:10 PM

When we use the bilibili software, other users can see our watch list. Some friends have expressed that they want to set the list to a private state. Here we will introduce how to hide the list. Open the "bilibili" app on your phone, enter the personal center page, and click "More Services" in the lower right corner of the bottom. Find the "Settings" function in the expanded options and click to open it. 2. After coming to the settings page, find "Security and Privacy" and click on it to enter. 3. Next, there is a "Space Settings" on the page you enter. When you see it, click on it to select it. 4. Finally, in the space settings page, there is a switch button behind "Public my watch list". Click the slider on it to set it to gray.

Use jQuery to modify the text content of all a tags Use jQuery to modify the text content of all a tags Feb 28, 2024 pm 05:42 PM

Title: Use jQuery to modify the text content of all a tags. jQuery is a popular JavaScript library that is widely used to handle DOM operations. In web development, we often encounter the need to modify the text content of the link tag (a tag) on ​​the page. This article will explain how to use jQuery to achieve this goal, and provide specific code examples. First, we need to introduce the jQuery library into the page. Add the following code in the HTML file:

See all articles