0

朋友功能如下,当用户单击按钮时,会打开一个弹出页面,其中包含复选框,用户在从复选框中选择值后单击弹出窗口提交,这些值将显示到父页面。我面临的问题是,当用户提交弹出值时,这些值会在父页面上消失,并且页面会重新加载,

弹出窗口的代码是

<a href="#" id="pop" >Select Language</a>
        <br />
        <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="Hindi" /> Hindi <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="Submit" 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">
                The selected Languages are: 
            </p>

Jquery 代码是

$(document).ready(function(){
        $('#saveOrg').click(function(){
            if(!$("#saveOrg").hasClass("notTwice")) {
                alert('Inside new  2');
                $("#saveOrg").addClass("notTwice");
                var arr = [];
                alert('Inside 3');
                $('input:checkbox:checked').each(function(){
                     $("#text").text($("#text").text() + $(this).val()+ " ,");
                });
                alert('Inside 5');
                 $('#overlay_form').fadeOut(500);
                 return false;

                }

        });             
    });

在 alert('Inside 5'); 之后检查的值消失了 在上面的代码中。 最后的css部分是

<style>
#overlay_form{
position: absolute;
border: 5px solid gray;
padding: 10px;
background: white;
width: 270px;
height: 380px;
}
#pop{
display: block;
border: 1px solid gray;
width: 65px;
text-align: center;
padding: 6px;
border-radius: 5px;
text-decoration: none;
margin: 0 auto;
}
</style>

请建议解决方法以保留从弹出窗口中选择的值。

4

1 回答 1

0

您可以将值放在会话 ID 或会话存储中(如果您使用的是 html5)。

于 2013-06-10T13:35:59.697 回答