javascript - 如何将下一步按钮添加到弹出窗口?

标签 javascript html css

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

这是我使用的脚本。

<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/

最佳答案

问题是 var $divs = $(this).parent().find(".modalDialog"); 它相对于“Open Modal”按钮是正确的,但是从“Next” “模态对话框 parent() 内的按钮不是包含模态 divs 的元素...尝试更改为 var $divs = $(".modalDialog");

关于javascript - 如何将下一步按钮添加到弹出窗口?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51278004/

相关文章:

javascript - 文档中的 CKEditor 样式表

javascript - 从函数内的结果填充数组对象

javascript - 转换缩放元素间距问题

html - 防止跨度中每个单词后换行

css - 类属性不被继承

html - CSS 未应用于 XUL 窗口 HTML 内容

javascript - 如何在ckeditor中对一个元素应用多种样式?

javascript - 如何配置 FCKeditor 将 HTML 符号保存为 XHTML 符号 (`&nbsp;` 将是 `&#160;` )?

html - 如何在 Shiny App 中使用 URL 呈现 HTML 文件而不破坏其他交互式绘图和表格?

php - Imagemagick 将图像放在右下角