multiple - jquery css width
cambiar el nombre de la clase (11)
Así que quieres cambiarlo CUANDO se haga clic ... déjame pasar por todo el proceso. Supongamos que su "Objeto DOM externo" es una entrada, como una selección:
Empecemos con este HTML:
<body>
<div>
<select id="test">
<option>Bob</option>
<option>Sam</option>
<option>Sue</option>
<option>Jen</option>
</select>
</div>
<table id="theTable">
<tr><td id="cellToChange">Bob</td><td>Sam</td></tr>
<tr><td>Sue</td><td>Jen</td></tr>
</table>
</body>
Algunos CSS muy básicos:
#theTable td {
border:1px solid #555;
}
.activeCell {
background-color:#F00;
}
Y configura un evento jQuery:
function highlightCell(useVal){
$("#theTable td").removeClass("activeCell")
.filter(":contains(''"+useVal+"'')").addClass("activeCell");
}
$(document).ready(function(){
$("#test").change(function(e){highlightCell($(this).val())});
});
Ahora, cada vez que elija algo de la selección, encontrará automáticamente una celda con el texto correspondiente, lo que le permitirá subvertir todo el proceso basado en la identificación. Por supuesto, si quisiera hacerlo de esa manera, podría modificar fácilmente la secuencia de comandos para usar ID en lugar de valores diciendo
.filter("#"+useVal)
y asegúrese de agregar los identificadores de forma adecuada. ¡Espero que esto ayude!
Quiero cambiar la clase de una etiqueta td dada la id de la etiqueta td:
<td id="td_id" class="change_me"> ...
Quiero poder hacer esto mientras estoy dentro del evento click de algún otro objeto dom. ¿Cómo tomo la identificación del td y cambio su clase?
Creo que estas buscando esto:
$(''#td_id'').removeClass(''change_me'').addClass(''new_class'');
Creo que quiere reemplazar un nombre de clase.
Algo como esto funcionaría:
$(document).ready(function(){
$(''.blue'').removeClass(''blue'').addClass(''green'');
});
de http://monstertut.com/2012/06/use-jquery-to-change-css-class/
En el caso de que ya tenga una clase y necesite alternar entre clases como oposición para agregar una clase, puede encadenar eventos de alternancia:
$(''li.multi'').click(function(e) {
$(this).toggleClass(''opened'').toggleClass(''multi-opened'');
});
Mejor uso el .prop para cambiar el className y funcionó perfectamente:
$(#td_id).prop(''className'',''newClass'');
para esta línea de código solo tiene que cambiar el nombre de newClass y, por supuesto, el id del elemento, en el siguiente ejemplo: idelementinourpage
$(#idelementinyourpage).prop(''className'',''newClass'');
Por cierto, cuando desea buscar qué estilo se aplica a cualquier elemento, simplemente haga clic en F12 en su navegador cuando se muestre su página y luego seleccione en la pestaña de DOM Explorer, el elemento que desea ver. En Estilos, ahora puede ver qué estilos se aplican a su elemento y de qué clase se lee.
Puedes configurar la clase (independientemente de lo que era ) usando .attr() , de esta manera:
$("#td_id").attr(''class'', ''newClass'');
Si desea agregar una clase, use .addclass() lugar, así:
$("#td_id").addClass(''newClass'');
O una forma corta de intercambiar clases usando .toggleClass() :
$("#td_id").toggleClass(''change_me newClass'');
Aquí está la lista completa de los métodos jQuery específicamente para el atributo de class .
Puedes hacer esto: $("#td_id").removeClass(''Old_class''); $("#td_id").addClass(''New_class''); $("#td_id").removeClass(''Old_class''); $("#td_id").addClass(''New_class''); O puedes hacer esto
$("#td_id").removeClass(''Old_class'').addClass(''New_class'');
Puedes revisar .addclass() o .toggleClass()
este método funciona bien para mi
$(''#td_id'').attr(''class'',''new class'');
EDITAR:
Si está diciendo que lo está cambiando de un elemento anidado , no necesita la ID en absoluto. Puedes hacer esto en su lugar:
$(this).closest(''td'').toggleClass(''change_me some_other_class'');
//or
$(this).parents(''td:first'').toggleClass(''change_me some_other_class'');
Respuesta original:
$(''#td_id'').removeClass(''change_me'').addClass(''some_other_class'');
Otra opción es:
$(''#td_id'').toggleClass(''change_me some_other_class'');
$(''.btn'').click(function() {
$(''#td_id'').removeClass();
$(''#td_id'').addClass(''newClass'');
});
or
$(''.btn'').click(function() {
$(''#td_id'').removeClass().addClass(''newClass'');
});