javascript - jQuery Mobile 不通过 ID

Question

我正在制作一个音频应用。
当我点击“播放”按钮时，它的 ID 应该会动态更改——比如 id = "paused"。
然后点击它，它应该会暂停，但这是行不通的。

$('#pauses').click(function())

当我单击暂停按钮时，它仍在播放。

请看例子:https://jsfiddle.net/shivam_sh/4zL4en10/2/

Answer 1

您可以进行简单的更改以使其正常工作。更改您的 html 添加 data-status

<a data-role="button" data-status="play" data-theme="a" id="play" href="#">Play</a>

对于 JavaScript 代码，您可以这样做。

$('#play').click(function() {
  if($(this).data('status') == "play") {
    $(this).text("P A U S E");
    $(this).data('status', 'pause');
    doPlay();
  } else {
    $(this).text("P L A Y"); 
    $(this).data('status', 'play');
    doPause();
  }  
});

jsfiddle link here

P.s: 避免修改elements的id