Détecter quand un input change de valeur par programmation

Version imprimable

17/09/2010, 16h38
Lapinpanda

Détecter quand un input change de valeur par programmation
Bonjour,

j'ai cherché mais point trouvé, comment faire récupérer l'évenement quand un input change de valeur.

Pour ma part je pensais que ceci fonctionnait :
Code:

1 2 3 4 5 $("input").change(function() { alert('Handler for .change() called.'); //ici le code que je voudrai executer });
Mais non. Une raison peux être, c'est que c'est un code javascript(dont je n'ai pas la main) qui modifie la valeur de cet input.

Ma question donc, comment faire pour lancer mon code une fois que ce script modifie la valeur de l'input?

merci
17/09/2010, 18h16
Edgar
Si j'ai bien saisi
Code:

1 2 3 4 function quinapalamain() { $('#selecteurDeLinput').change(); }
[Edit]
j'ai peut être pas répondu exactement à ta question ,

si c'est un code javascript dont tu n'as pas la main , donc sur la conception ,je suggérerais l'utilisation d'un timer qui régulièrement scrute le contenu de ton input

Bonsoir

Vous avez raison, car l'événement change est seulement déclenché lorsque l'utilisateur modifie le contenu d'un input.

On peut résoudre le problème en demandant au code existant qu'il envoie l'événement change après avoir modifié un input, simplement en lui ajoutant -- .trigger("change"); -- voir le code du bouton "Changer".

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<!doctype html>
<html lang="fr">
<head>
	<meta charset="utf-8">
	<meta name="Author" content="Daniel Hagnoul">
	<title>Forum jQuery</title>
	<style>
		/* BASE */
		body {
			background-color:#dcdcdc;
			color:#000000;
			font-family:sans-serif;
			font-size:medium;
			font-style:normal;
			font-weight:normal;
			line-height:normal;
			letter-spacing:normal;
		}
		h1,h2,h3,h4,h5 {
			font-family:serif;
		}
		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img {
			margin:0px;
			padding:0px;
		}
		p {
			padding:6px;
		}
		ul,ol,dl {
			list-style:none;
			padding-left:6px;
			padding-top:6px;
		}
		li {
			padding-bottom:6px;
		}
 
		/* dvjh */
		h1 {
			text-align:center;
			font-style:italic;
			text-shadow: 4px 4px 4px #bbbbbb;
		}
		h2 {
			text-align:center;
		}
		div#conteneur {
			width:95%;
			height:auto;
			margin:12px auto;
			padding:6px;
			background-color:#FFFFFF;
			color:#000000;
			border:1px solid #666666;
		}
		div#affiche {
			clear:both;
			margin:12px;
			padding:6px;
			border:1px solid #999999;
			background-color:#FFFFFF;
			color:#000000;
		}
 
		/* TEST */
	</style>
	<script charset="utf-8" src="../lib/jqueryui/js/jquery-1.4.2.min.js"></script>
	<script>
		$(function(){
			$("input").each(function(i, item){
				$("#affiche").append("<p>input[" + i + "] = " + $(item).val() + "</p>");
			});
 
			$("input[type='text']").change(function(event){
				$("#affiche").append("<p>$(this).val() = " + $(this).val() + "</p>");
			});
 
			$("#btn").click(function(){
				$("input[type='text']").val("pourquoi pas").trigger("change");
			});
		});
	</script>
</head>
<body>
	<h1>Forum jQuery</h1>
	<div id="conteneur">
		<button id="btn">Changer</button>
		<input type="text" value="oui"/>
		<input type="text" value="non"/>
		<input type="text" value="peut-être"/>
		<input type="text" value="sans doute"/>
		<div id="affiche"></div>
	</div>
</body>  
</html>

20/09/2010, 08h57
Lapinpanda

trés intéressant merci :)

je vais essayer ;)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
//when input .change raise do this
$("input").change(function(){
 PreFilledValue();
 });
 
//override default behavior
$("input").parent().children("img").click(function(){
$(this).parent().children("select").dblclick(function(){
$("input").trigger("change");
});
});

Perfect!

Merci beaucoup c'est magnifique :ccool: :merci:

20/09/2010, 21h01
danielhagnoul

Bonsoir

Code:

$("input"]").trigger("change");

:koi: Un caractère en trop, un reliquat de mon exemple qui n'est pas utile ici.

Code:

$("input").trigger("change");
21/09/2010, 08h33
Lapinpanda

Copier/coller + suppression d'inutile == :boulet: