Question

如果没有选中复选框，我有一个限制点击href链接的脚本。我想在模式框中打开editpr.php。问题是我不熟悉modalbox。有什么帮助吗？

<a class="button edit" style="cursor:pointer;" ><span><b>Edit Purchase Request</b></span></a>
<a class="button remove" style="cursor:pointer;" name="remove"><span><b>Remove Purchase Request</b></span></a>

这是我的剧本

jQuery(function ($) {
    $('a.button.edit, a.button.remove').click(function () {
        if ($('input[name="checkbox[]"]:checked').length == 0) {
            return;
        }

        if (!confirm('Do you want to continue?')) {
            return
        }

        var frm = document.myform;
        if ($(this).hasClass('edit')) {
            frm.action = 'editpr.php';
        }
        if ($(this).hasClass('remove')) {}
        frm.submit();
    })
})

Answer 1

您无法使用纯javascript在模态框中打开页面，因为＆＃34; alert（）＆＃34;或＆＃34;确认（）＆＃34;。

要做你想做的事，你需要把你的＆＃39; editpr.php＆＃39; div中的内容，并使用CSS进行模态化。

实际上我们有很多库可以轻松实现，我认为最常用的是：http://www.jacklmoore.com/colorbox/

检查＆＃34;外部HTML（Ajax）＆＃34;和＆＃34;外部网页（iframe）＆＃34;在这个示例页面上，可能与您想要做的事情相同：http://www.jacklmoore.com/colorbox/example1/

Answer 2

有一些有用的jQuery插件可以让你的工作变得非常简单。我建议你试一试。 Here你有一个例子。

Answer 3

由于您已经在使用jQuery，因此可以使用jquery-ui。

他们有一个你想要做的事情： http://jqueryui.com/dialog/#modal

设置完模态对话框元素之后，您只需要make和XHR for editpr.php，将结果加载到元素innerhtml中，然后显示对话框。

// setup your modal dialog
var el = $( "#editpr-dialog" ).dialog({
  // ... (other config options)
  modal: true
});

// XHR editpr.php and show the dialog box
$.get('editpr.php', function(data){
  el.html(data).dialog('open');
});

Answer 4

custombox插件具有许多精美的功能，并且可以与Jquery完美配合：http://dixso.github.io/custombox/

在模态框中打开页面

4 个答案: