如何防止点击按钮直到点击同一页上的单独按钮？

我在开始游戏之前必须观看视频的页面上工作。视频和游戏链接位于同一页面上。有没有简单的方法来“锁定”一个链接，直到单击一个单独的链接。这里是按钮的一个片段：如何防止点击按钮直到点击同一页上的单独按钮？

<table class="t1"> 
 
     <tr> 
 
      <th class="th1"><a href="<?php echo $video_url;?>" target="_blank"><div type = "button" class="button button1">Watch Video</div></a></th> 
 
      <th class="th1"><a><div class="button button2">Objective:<div class ="desc"><?php echo $game_description;?></div></div></a></th> 
 
      <th class="th1"><a href="<?php echo $construct_url;?>" target="_blank"><div type = "button" class="button button3">Play Game</div></a></th> 
 
     </tr> 
 
</table>

来源

2017-08-31 Austin Hardesty

我看不到任何按键有 –

@AlonEitan我猜的联系是他的“按钮” – j08691

@ j08691你确定它不是** ** DIV'型= button'？ :) –

你并不是真的有按钮，而是锚，所以你可以防止一个锚上的默认动作，直到另一个被点击，像这样

var btn1 = document.getElementById('btn1'); 
 
var btn2 = document.getElementById('btn2'); 
 
var skip = true; 
 

 
btn1.addEventListener('click', function() { 
 
    skip = false; 
 
}); 
 

 
btn2.addEventListener('click', function(evt) { 
 
    if (skip) evt.preventDefault(); 
 
});

<table class="t1"> 
 
    <tr> 
 
    <th class="th1"> 
 
     <a href="test" target="_blank" id="btn1"> 
 
     <div type="button" class="button button1">Watch Video</div> 
 
     </a> 
 
    </th> 
 
    <th class="th1"> 
 
     <a> 
 
     <div class="button button2">Objective: 
 
      <div class="desc"> 
 
      description 
 
      </div> 
 
     </div> 
 
     </a> 
 
    </th> 
 
    <th class="th1"> 
 
     <a href="test" target="_blank" id="btn2"> 
 
     <div type="button" class="button button3">Play Game</div> 
 
     </a> 
 
    </th> 
 
    </tr> 
 
</table>

来源

2017-08-31 19:09:55 adeneo

我会使用jQuery对于这一点，你可以只是没有显示链接，直到按钮被点击，例如：

$(document).ready(function(){ 
    $("#showThisSecond").hide(); 
    $("#showThisFirst").click(function(){ 
     $("$showThisSecond").show(); 
    }); 
}); 

<button id='showThisFirst' /> 
<button id='showThisSecond' />

来源

2017-08-31 19:09:32 clearshot66

如果您既传递，视频和游戏，到客户端没有什么阻止客户端只需删除从DOM的限制。

假设一个普通用户，您可以使用disabled属性来防止有人点击按钮。一个更安全的方法是，根本不传递链接，请求并在之后添加它视频已被用户观看（可能添加按钮但只指定href属性，如果视频已被观看）。

这显然必须使用JavaScript来完成。有几种解决方案涉及不传递链接，隐藏链接或使用HTML5属性来防止单击按钮。

来源

2017-08-31 19:11:05 GxTruth

如何防止点击按钮直到点击同一页上的单独按钮？

回答

相关问题