Question

我想应用以下脚本在弹出窗口上创建下一个按钮。当我使用代码打开弹出窗口时，它可以正常工作。但是，当尝试应用代码来创建下一个按钮时，它将不起作用。请帮助我解决问题。

这是我使用的脚本。

<script>       
$(document).ready(function() {
   $(".getAssignment").click(function() {
      var $divs = $(this).parent().find(".modalDialog");
      if ($divs.length > 0) {
         window.location.href = "#" + $divs[ Math.floor(Math.random() * $divs.length) ].id;
      }
   });
});    
</script> 

<input class="getAssignment" type="button" value="Open Modal">

<div id="openModal" class="modalDialog">
    <div>
    <input class="getAssignment" type="button" value="Next">    
   <a href="#close" title="Close" class="close">X</a>
   <h2>Modal Box</h2>
        <p>This is a sample modal box that can be created using the powers of CSS3.</p>
        <p>You could do a lot of things here like have a pop-up ad that shows when your website loads, or create a login/register form for users.</p>
    </div>
</div>

https://jsfiddle.net/Sanjeewani/0pfov2b9/6/

Answer 1

问题是var $divs = $(this).parent().find(".modalDialog");相对于“打开模态”按钮是正确的，但是模态对话框parent()中的“下一步”按钮不是包含模态div的元素。。尝试更改为var $divs = $(".modalDialog");

Answer 2

这可以通过获得一个随机的div编号来完成。我对js代码进行了一些友好的检查

$(document).ready(function() {
  var sr_num = ['1', '2', '3']; 
  $(".getAssignment").click(function() {
    var rand = sr_num[Math.floor(Math.random() * sr_num.length)];
    var demo = "#openModal" + rand;
    window.location.href.split('#')[0]
    window.location.href = demo;
  });
});

这里是工作代码check here

希望对您有帮助

如何添加下一个按钮弹出？

2 个答案: