Bienvenid@s, hoy veremos como acceder a un campo label a través del atributo for y así poder realizar acciones sobre este campo con Jquery como cambiar el texto, agregarle html, cambiar sus propiedades CSS, etc ...
La estructura básica de un campo label es la siguiente ...
<label for="me">TEXTO LABEL</label>
Para poder acceder al atributo for, no vale con hacerlo mediante el método attr, ya que este método te devolverá su valor si lo haces así : $("label").attr("for"); y si lo haces de esta otra forma sólo estarás asignándole de nuevo el valor: $("label").attr("for", "me");
Así que para este caso sólo queda la opción de acceder a "for" mediante el selector de la siguiente manera ...
$("label[for='me']").text("TEXTO LABEL CAMBIADO CON ÉXITO");
A continuación puedes ver un ejemplo práctico, en el cual al hacer click sobre un botón se cambiará el texto del label seleccionado, gracias al acceso a su atributo for ...
<!-- By http://jquery-manual.blogspot.com -->
<!DOCTYPE HTML>
<html>
<head>
<title>Como acceder a un campo label a través del atributo for con Jquery</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(function(){
$("#btn").click(function(){
$("label[for='me']").text("TEXTO LABEL CAMBIADO CON ÉXITO");
});
});
</script>
</head>
<body>
<h1>Como acceder a un campo label a través del atributo for con Jquery</h1>
<pre>
$("#btn").click(function(){
$("label[for='me']").text("TEXTO LABEL CAMBIADO CON ÉXITO");
});
</pre>
<input type="button" id="btn" value="Cambiar el texto del label">
<label for="me">TEXTO LABEL</label>
</body>
</html>
1 comentario:
excelente!! muy bueno
Publicar un comentario