Home >Web Front-end >Front-end Q&A >How to delete the name attribute value in jquery

How to delete the name attribute value in jquery

青灯夜游
青灯夜游Original
2022-09-27 18:07:591787browse

Two methods: 1. Use attr() to modify the value of the name attribute and set it to an empty character. The syntax is "$(selector).attr("name","");". 2. Use prop() to modify the value of the name attribute and set it to an empty character. The syntax is "$(selector).prop("name","");".

How to delete the name attribute value in jquery

The operating environment of this tutorial: windows7 system, jquery3.6.1 version, Dell G3 computer.

HTML name attribute

name is mainly an attribute that only exists in form elements.

name attribute specifies the name of the form element (eg input). The

name attribute is used to identify the form data after it is submitted to the server or to reference the form data through JavaScript on the client.

Note: Only form elements with the name attribute set can pass their values ​​when submitting the form.

jquery deletes the name attribute value

Deleting the name attribute value can be understood as clearing the name attribute value, that is, setting it to an empty character.

JQuery provides two functions for setting attribute values:

  • attr()

  • prop()

Method 1: Use attr() to set attribute values ​​

attr() syntax:

//单个属性
$(selector).attr("属性名","新属性值");

//多个个属性
$(selector).attr({属性1:"新值",属性2:"新值"....});

Example: Modify the value of the name attribute and set it to an empty character

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <script src="js/jquery-3.6.1.min.js"></script>
        <script>
            $(document).ready(function() {
                $("button").click(function() {
                    $("input").attr("name","");
                });
            });
        </script>
    </head>
    <body>
        <form action="form_action.asp" method="get">
          <p>name:<input type="text" name="fullname" /></p>
          <p>email:<input type="text" name="email" /></p>
        </form>
        <button>删除name属性值</button>
    </body>
</html>

How to delete the name attribute value in jquery

Method 2: Use prop() to set the attribute value

prop() syntax:

//单个属性
$(selector).prop("属性名","新值");

//多个个属性
$(selector).prop({属性1:"新值",属性2:"新值"....});

Example: Modify the value of the name attribute and set it to an empty character

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <script src="js/jquery-3.6.1.min.js"></script>
        <script>
			$(document).ready(function() {
				$("button").click(function() {
					$("input").prop("name","");
				});
			});
        </script>
    </head>
    <body>
        <form action="form_action.asp" method="get">
          name:<input type="text" name="name" /><br />
          email:<input type="text" name="email" /><br />
		  password:<input type="password" name="password" /><br />
        </form><br />
        <button>删除name属性值</button>
    </body>
</html>

How to delete the name attribute value in jquery

jquery prop () and attr() difference:

attr() definition

attr() method sets or returns the attributes and values ​​of the selected element .

When this method is used to return an attribute value, the value of the first matching element is returned.

When this method is used to set attribute values, one or more attribute/value pairs are set for the matching element.

prop()Definition

The prop() method sets or returns the properties and values ​​of the selected element.

When this method is used to return an attribute value, the value of the first matching element is returned.

When this method is used to set attribute values, one or more attribute/value pairs are set for the set of matching elements.

  • $('').attr()Returns the html object

  • $(' ').prop()returns the DOM object

prop()

method operates radio (checkbox) and the like When a control is selected, the selected value of the control will also change accordingly. That is, you can control both its selection and its deselection;

is similar to $("...").attr("checked"); returns true or false

If there is a corresponding attribute, the attribute is returned. If not, an empty string is returned.

attr():

Method operation## When controls such as #adio (checkbox) are selected, the selected value of the control will not change accordingly. That is, you can only control its selection, but not its deselection;

is similar to

$("...").attr("checked");The returned value is 'checked' or undefined

If there is a corresponding attribute, the attribute is returned. If not, undefined is returned.

Usage scenarios of attr and prop:

1 .Add the attribute name and the attribute will take effect. You should use prop();

2. If there are two attributes, true and false, use prop(); (such as 'checked', 'selected', 'disabled', etc. )

3. For others, use attr();

Officially recommended use:

How to delete the name attribute value in jquery

[Recommended learning:

jQuery video Tutorialweb front-end video

The above is the detailed content of How to delete the name attribute value in jquery. 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