javascript - 有没有办法缩短 jQuery 代码，尤其是在使用显示和隐藏函数时？

Question

我试图找到可能使这个 jQuery 代码更短的 jQuery 函数。我试着看一下切换，但我看不出它是如何工作的。我现在只是想学习 jQuery 的最佳实践。谢谢你。

$(".play").click(function (e) {
  e.preventDefault();
  video.ref.playVideo();
  $(".play").hide();
  $(".pause").show();
});
$(".pause").click(function (e) {
  e.preventDefault();
  video.ref.pauseVideo();
  $.(".pause").hide();
  $(".play").show();
});

Answer 1

我想不出如何让它更短，但是通过缓存两个主要的 jQuery 对象并在可能的情况下引用当前对象 $(this) 可以更好地执行。

var $_play = $('#play'),
    $_pause = $('#pause');
$_play.click(function(e){
    video.ref.playVideo();
    $(this).hide();
    $_pause.show();
    e.preventDefault();
});
$_pause.click(function(e){
    video.ref.pauseVideo();
    $(this).hide();
    $_play.show();
    e.preventDefault();
});

Answer 2

代码已经很短了，但如果你真的想的话，你可以结合这两个事件。

var $playPause = $(".play,.pause").click(function(e){
    var func = $(this).hasClass('play') ? 'play' : 'pause';
    e.preventDefault();
    video.ref[func+'Video']();
    $playPause.toggle();
});