模态窗口不关闭答案

【问题标题】：modal window doesn't close模态窗口不关闭
【发布时间】：2012-08-22 07:36:33
【问题描述】：

我的 php 脚本中有两个函数，它们位于 QandA2Table.php 中，但它们的按钮位于 previousquestions.php 页面中，因为模式窗口会显示该页面的详细信息。

反正我下面有两个按钮，分别是“关闭”按钮和“添加”按钮：

<div id="previouslink">
<button type="button" id="close" onclick="return parent.closewindow();">Close</button>

</div>

<?php 

      $output = "";

        while ($questionrow = mysql_fetch_assoc($questionresult)) {
$output .= "
<table>
      <tr>
      <td id='addtd'><button type='button' class='add'>Add</button></td>
      </tr>";
        }
        $output .= "        </table>";

        echo $output;

  }

}

?>

我遇到的问题是关闭模式窗口。当我单击“关闭”按钮时，它会关闭模态窗口，这很棒，但是如果我单击“添加”按钮，则它不会关闭模态窗口。这是为什么呢？

下面是两个按钮功能：

function closewindow() {     

    $.modal.close(); 
    return false;
} 

         $(".add").on("click", function(event) {
        console.log("clicked");

        var theQuestion = $("td:first-child", $(this).parent()).text();

        if ($('.activePlusRow').length > 0) {
            $('.activePlusRow').next('.textAreaQuestion').val(theQuestion);
        }
        parent.closewindow();
        return true;
    });

下面是iframe：

function plusbutton() { 
    // Display an external page using an iframe 
    var src = "previousquestions.php"; 
    $.modal('<iframe src="' + src + '" style="border:0;width:100%;height:100%;">');
    return false;
}

【问题讨论】：

欢迎来到 SO！在添加按钮处理程序中运行 $.modal.close() 之前是否存在 JavaScript 错误？
@Jack 在错误控制台中没有显示错误
self.parent.tb_remove()，关闭 iframe 窗口。
抱歉，我不知道哪个 JavaScript 在哪个页面上； html 引用 parent.closewindow，但该函数似乎与单击处理程序上的添加按钮在同一页面中声明......非常混乱
php 标签是干什么用的？ ;)

标签： php javascript

【解决方案1】：

如果我没有误会你的话。原因和解决方法很简单

您在其中创建 iframe 的模态容器页面具有这些功能，对吗？

closewindow() 和函数 plusbutton()

除了他们还有你

$(".add").on("click", function(event) {
    ...............

如果我理解正确的话，在主 html 中的部分事件捕获器？

所以你不能指望 $(".add").on("click", function(event) .... 被 iframe 内的按钮触发。

您可以简单地将 $(".add").on("click", function(event) 转换为函数

改一下

$(".add").on("click", function(event) {
    console.log("clicked");

    var theQuestion = $("td:first-child", $(this).parent()).text();

    if ($('.activePlusRow').length > 0) {
        $('.activePlusRow').next('.textAreaQuestion').val(theQuestion);
    }
    parent.closewindow();
    return true;
});

到

function add_function {
    console.log("clicked");

//通过添加框架 id 引用更改此部分以适合您的内容层次结构。 // 我不知道你将在 td:first-childs parent 中解析的数据。 var theQuestion = document.frames["the_frame"].$("td:first-child", $(this).parent()).text();

    if ($('.activePlusRow').length > 0) {
        $('.activePlusRow').next('.textAreaQuestion').val(theQuestion);
    }
    parent.closewindow();
    return true;
}

并在 iframe 内容中更改这一行

<td id='addtd'><button type='button' class='add'>Add</button></td>

到

<td id='addtd'><button type='button' class='add' onclick="parent.add_function();" >Add</button></td>

并在 plusbutton 函数的 iframe 创建者行中添加一个 id

 $.modal('<iframe if="the_frame" src="' + src + '" style="border:0;width:100%;height:100%;">');

【讨论】：