Home > Article > Web Front-end > Example analysis of change() usage in jquery_jquery

Example analysis of change() usage in jquery_jquery

WBOYOriginal: 2016-05-16 16:15:311083browse

This article analyzes the usage of change() in jquery with examples. Share it with everyone for your reference. The specific analysis is as follows:

change() When the value of an element changes, the change event occurs. This event only applies to text fields, and textarea and select elements.
When used on a select element, the change event occurs when an option is selected. When used with a text field or text area, this event occurs when the element loses focus.

1. How to use change

1. Trigger change event: Trigger change event of selected element

Syntax: $(selector).change()

2. Bind the function to the change event: Specify the function to be run when the change event of the selected element occurs.

Syntax: $(selector).change(function)

2. Example of change() in jquery

<html>
<head>
<script type="text/javascript" src="jquery文件"></script>
<script type="text/javascript">
$(document).ready(function(){
 $(".field").change(function(){
  $(this).css("background-color","#FFFFCC");
 });
 $("button").click(function(){
  $("input").change();
 });
});
</script>
</head>
<body>
<button>激活文本域的 change 事件</button>
<p>Enter your name: <input class="field" type="text" /></p>
</body>
</html>

<html>
<head>
<script type="text/javascript" src="jquery文件"></script>
<script type="text/javascript">
$(document).ready(function(){
 $(".field").change(function(){
  $(this).css("background-color","#FFFFCC");
 });
});
</script>
</head>
<body>
<p>在某个域被使用或改变时，它会改变颜色。</p>
Enter your name: <input class="field" type="text" />
<p>Car:
<select class="field" name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</p>
</body>
</html>

I hope this article will be helpful to everyone’s jQuery programming.

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

Previous article：JavaScript exception handling detailed explanation_javascript skillsNext article：JavaScript exception handling detailed explanation_javascript skills

See more

Example analysis of change() usage in jquery_jquery

Related articles