Tengo completa jsfiddle muestra http://jsfiddle.net/snijsure/usg8z/3/

Básicamente he función de javascript como se muestra a continuación

function playButtonPress() {

    if (play == false) {
        $("#playbutton").removeClass("icon-play").addClass("icon-stop").button('refresh');

        console.log("playButton pressed play was false show pause button");
        play = true;
    } else {
        $("#playbutton").removeClass("icon-pause").addClass("icon-play").button('refresh');
        console.log("playButton pressed play was true show play button");
        play = false;
    }
}

Quiero activar un botón de icono entre los ‘play’ y de ‘pausa’. es decir, si el usuario estaba jugando en algunos de los contenidos el botón de pausa y si el usuario no estaba jugando contenido debe ser el «juego».

Parece que me he enganchado a todos a la función de javascript correctamente, pero parece que no puede averiguar cómo cambiar el icono de la clase de botón de icono de play & icono de pausa.

¿Cómo hace uno para cambiar el icono asociado a un botón mediante programación? También veo un comportamiento diferente en chrome el icono no cambia, pero el tamaño es muy pequeño, mientras que en el icono de Firefox no cambia.

O hay alguna manera mejor de hacerlo?

  • lo que es .botón()?

4 Comentarios

  1. 2

    Necesita modificar la clase en el i elemento. También, usted puede hacer los dos casos en uno:

    function playButtonPress() {
        $("#playbutton i").toggleClass("icon-stop icon-play");
    
        console.log("playButton pressed play was "+play);
    
        play = !play;
    }

    http://jsfiddle.net/Zxfn8/

    • Wow! impresionante. Muchas gracias.
    • <button id=»btnRefresh» class=»ui-botón ui-widget ui-corner-all» title=»Refresh» disabled=»true;» onclick=»tableRefresh()»> <span class=»ui-icon ui-icon-play»></span> <!– actualización –> </botón> tuve que usar el «span» elemento», no «yo»: $(«#btnRefresh span»).toggleClass(«ui-icon-play ui-icon-pause»);
  2. 0

    Tienes que seleccionar el <i> elemento para cambiar la clase. Como por ejemplo que:

    $("#playbutton i").removeClass("icon-play").addClass("icon-stop");

    También tiene icon-stop y icon-pause tienes decide por uno de ellos.

    Trabajo de violín.

    Y creo que no necesita $("#playbutton").button('refresh');.

  3. 0

    Desde bootstrap inicializa algunos de los elementos cuando el documento está listo, usted debe tener el botón de pausa después de que el botón de play, pero escondido:

    agregar esto después de que su botón de play:

    <button type="button" id="pauseButton" class="btn" onclick='playButtonPress()'><i class="icon-pause"></i></button>

    agregar esto en tu CSS

    #pauseButton{display:none;}

    y su JS debe tener este aspecto

      function playButtonPress() {
        if (!play) {
          $("#playbutton").hide();
          $("#pauseButton").show();
          play = true;
        } else {
          $("#pauseButton").hide()
          $("#playbutton").show();
          play = false;
        }
     }
  4. -1

    En su código original de su cambiar el icono de la clase en el botón que desea cambiar el <i> etiqueta.

    Intente esto en su lugar:

    function playButtonPress() {
    if (play == false) {
        $("#playbutton i").removeClass("icon-play").addClass("icon-pause");
    
        console.log("playButton pressed play was false show pause button");
        play = true;
    } else {
        $("#playbutton i").removeClass("icon-pause").addClass("icon-play");
        console.log("playButton pressed play was true show play button");
        play = false;
    } }

    Actualizado El Violín

    • Atención para explicar el voto?

Dejar respuesta

Please enter your comment!
Please enter your name here