javascript - 设置一个 on.click 以获得更多操作 - javascript 和 jQuery

Question

我有一些动态生成按钮，可以将我带到特定页面。

我需要检索为每个按钮自动生成的 data-num，用它来为同一个按钮设置 jQuery 选择器。所以当我点击按钮时，我将被重定向到页面(pdf.js)。

不过在我的解决方案中，我需要点击两次才能转到该页面。

• 第一次点击是设置变量i
• 第二次点击是实际转到页面

我正在寻找一种只允许我进行一次点击的奇特解决方案

$('.pag').click(function(){
 let i= $(this).data('num');
 //let desiredPage= $(this).data('num');
 console.log(i);

 console.log(i);
  $('#pag-'+ i).click(function(){
queueRenderPage(i);
  })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <div id="pag-1" data-num="1" class="prev-next pag">1</div>
    <div id="pag-2" data-num="2" class="prev-next pag">2</div>
    <div id="pag-3" data-num="3" class="prev-next pag">3</div>
    <div id="pag-4" data-num="4" class="prev-next pag">4</div>
     .....

Answer 1

只需在第一次点击时用相应的数字执行queueRenderPage():

$('.pag').click(function() {
  let i = $(this).data('num');
  queueRenderPage(i);
})

//
function queueRenderPage(i) {
  console.log("queueRenderPage("+i+")");
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <div id="pag-1" data-num="1" class="prev-next pag">1</div>
    <div id="pag-2" data-num="2" class="prev-next pag">2</div>
    <div id="pag-3" data-num="3" class="prev-next pag">3</div>
    <div id="pag-4" data-num="4" class="prev-next pag">4</div>
     .....