Jquery toggle button value

Question

In the code below, when you press the play button, its value must be paused, and when pause is pressed, another function should be called. How to do this using jquery toggle

<input type="button" onclick ="play" value="play"/> <script> function play() { play_int(); // Button value to be changed to pause } And when pause play_pause(); 

Answer 1

Give your button an identifier:

 <input type="button" id="play" value="play"/> 

Then you can do something like this:

 $('#play').click(function() { if ($(this).val() == "play") { $(this).val("pause"); play_int(); } else { $(this).val("play"); play_pause(); } }); 

Or a slightly tidier version:

 $(function(){ $('#play').click(function() { // if the play button value is 'play', call the play function // otherwise call the pause function $(this).val() == "play" ? play_int() : play_pause(); }); }); function play_int() { $('#play').val("pause"); // do play } function play_pause() { $('#play').val("play"); // do pause } 

Working demo

Answer 2

try (in jQuery < 1.9 )

 $("input[type='button']").toggle( function(){ $(this).val("Pause"); }, function(){ $(this).val("Play"); } ); 

Demo

Note. The toggle event was deprecated in 1.8 and removed in 1.9

Answer 3

I would say

 statuses = ['Play', 'Pause']; $('#btn_play').val( $('#btn_play').val() == statuses[0] ? statuses[1] : statuses[0] ); 

Answer 4

 $('#play_button_id').toggle(play,play_pause); 

this will trigger the play () function the first time the button is pressed

and play_pause () when the button is pressed again

Answer 5

The simplest idea might be this.

 function play(action) { { if(action=='play') { play_int(); $("#btn_play").val('pause'); } else { pause_int(); $("#btn_play").val('play'); } } $("#btn_play").click(function() { val = $(this).val(); play(val); }