將one on.click設置為更多操作-javascript和jQuery

Question

我有一些動態生成按鈕，這些按鈕會將我帶到特定頁面。

我需要檢索為每個按鈕自動生成的data-num ，並使用它為同一按鈕設置jQuery選擇器。 因此，當我單擊按鈕時，我將被重定向到pdf.js頁面。

在我的解決方案中，我需要單擊兩次以轉到頁面。

• 第一步是設置變量i
• 第二次單擊實際上是轉到該頁面

我在searchig尋找一種出色的解決方案，該解決方案只允許我單擊一下

 $('.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> ..... 

Answer 2

您無需使用函數即可執行此操作。

 $('.pag').click(function(){ let i= $(this).data('num'); //let desiredPage= $(this).data('num'); console.log(i); 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> .....