javascript - Jquery 弹出窗口将选定的复选框值传递给父窗口不起作用

Question

friend

我正在编写一个 jsp，它使用带有复选框的 jQuery 打开一个弹出窗口，然后用户可以选择弹出窗口上的所有复选框值，然后在 Submit 上，它会显示到父窗口， 到目前为止，我能够在单击时打开一个弹出窗口，显示复选框列表，并且我正在努力将选中的复选框值发送到父页面，请建议

我的代码是

<form action= "" id ="overlay_form" method= "post" style="display:none">
        <h3>Select Language</h3> 
        <br /><br />
        <input type="checkbox" name="countryCheckbox[]" value="English" /> English  <br/>
        <input type="checkbox" name="countryCheckbox[]" value="French" /> French  <br/>
        <input type="checkbox" name="countryCheckbox[]" value="Norwagian" /> Norwagian  <br/>
        <input type="checkbox" name="countryCheckbox[]" value="Swedish" /> Swedish <br/>
        <input type="checkbox" name="countryCheckbox[]" value="Chinese" /> Chinese <br/>
        <br /><br />
        <div class="row-fluid grid-footer">
        <div class="span8"></div>
        <div class="span5">
        <input class="btn btn-primary btn-primary-secondary" type="submit" name="saveDepartmentBtn" id="saveOrg" value="Save" onclick="this.disabled='disabled'; document.getElementById('saveOrg').disabled='disable';this.form.submit(); ">
          </div>
          <div class="span1">
        <button  class="btn btn-secondary" type="button" cancel-action="/admin/role/list" ><spring:message code="common.cancel" /></button>
        </div>
        </div>
    </form>
<p id="text">
                Selected Languages are: 
            </p>

现在将选中的复选框数据发送到父级，我的 JQuery 代码是

$(document).ready(function(){
        $('#overlay_form').submit(function(){

                    $('input:checkbox:checked').each(function(){
                        window.parent.$("#text").text(parent.$("#text").text() + $(this).val()+" ,");

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

但是，将选定的复选框数据发送到父窗口不起作用 请指教

Answer 1

您实际上并没有创建一个真正的窗口。这是一个叠加。所以它不是一个弹出窗口，也不是一个窗口，因此您正在使用的内容没有 window.parent 。

相反，您有一个隐藏的 div/表单，它会显示并放置在窗口上方。由于这一切都是通过 CSS 和 Javascript 完成的，因此您的表单没有 parent，因为它与标记的其余部分位于同一窗口中。

我确信，如果您查看浏览器的 JavaScript 控制台，您会看到类似 window.parent is null/not an object 的错误。

这就是解释。答案是:从代码中删除 window.parent 和 parent 。由于它不是一个窗口，因此您不是关闭窗口，因此您的close很可能是fadeOut。

$(document).ready(function(){
    $('#overlay_form').submit(function(){

                $('input:checkbox:checked').each(function(){
                    $("#text").text($("#text").text() + $(this).val()+ " ,");

                });
                $('#overlay_form').fadeOut(500);

                return false;
    });             
});