How to delete the name attribute value in jquery-Front-end Q&A-php.cn

How to delete the name attribute value in jquery

青灯夜游

Release： 2022-09-27 18:07:59

Original

1790 people have browsed it

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:"新值"....});

Copy after login

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>

Copy after login

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:"新值"....});

Copy after login

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>

Copy after login

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 Tutorial、web 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!