Ver abajo el código. Cuando se hace clic en esto, el texto se pone en negrita. Me gustaría poder alternar entre texto 'normal' y 'negrita' haciendo clic en el mismo botón. ¿Cómo podría lograr esto?

$("#InputsWrapper").on("click", ".boldText", function (e) {
    e.preventDefault();
    $(this).parent().find(".fTypex").css({"font-weight":"bold"});
});
1
Nelie 2 sep. 2014 a las 19:58

3 respuestas

La mejor respuesta

El mejor enfoque sería alternar la clase con toggleClass:

CSS:

.bold { font-weight: bold; }

JavaScript:

$('#InputsWrapper').on('click', '.boldText', function(e) {
    $(this).parent().find('.fTypex').toggleClass('bold');
    e.preventDefault();
});

DEMO: http://jsfiddle.net/bz9wnh6m/

2
VisioN 2 sep. 2014 a las 16:05

EDITADA:

Html:

<a href="#" class="boldtrigger">Bold</a>
<div class="text"> Here is the text </div>

Js:

$(".boldtrigger").click(function() {
    $(".text").toggleClass("bold");
});

Aquí hay un ejemplo de trabajo para JQUERY 2.0+ usando el método toggleClass (): http://jsfiddle.net/S9qDD/

¡Salud!

0
Andrew 2 sep. 2014 a las 16:09

Lo que quieres es el método .toggleClass (). aquí hay un enlace

Y un ejemplo

<script>
 $("#InputsWrapper").on("click", ".boldText", function (e) {
e.preventDefault();
   $(this).parent().find(".fTypex").toggleClass("bold-text");
});
</script>
<style>
 .bold-text{
     font-weight":"bold;
 }
</style>
0
Layon Ferreira 2 sep. 2014 a las 16:02