弹出输入字段在IE浏览器中显示空白,单次更新

时间:2013-11-25 10:52:02

标签: javascript jquery html internet-explorer

IE9浏览器特定问题

我有一个更改密码模式表单JSP,带有2个按钮(UpdateCancel),使用HTML,jquery和JS。

当此人在三个输入字段中给出值(旧密码,新密码和确认新密码)时,单击“更新”按钮将更新所有字段并为另一个用户提供友好弹出窗口(例如“您的密码已更新) “)。

输入字段显示空白值,而不是弹出窗口。如果我第二次这样做(再次输入3个输入字段并单击“更新”按钮),我就能得到用户友好的消息。这意味着我无法在第一时间更新。它特定于IE浏览器,对于剩余的浏览器,它工作正常。有什么建议/解决方案吗?

<div id="hd">
    <h1>Account Settings</h1>
</div>
<div id="bd" role="main">
    <form id="edit_password" name="edit_password" method="post" secure="true">
        <input type="hidden" name="USER_ACCOUNT<>usa_id" value="${currentUser.longID}"/>
        <fieldset class="labelleft">
            <label for="user-pass">
                <span class="label">Old Password</span>
                <input type="password" name="oldPassword" required="true" autocomplete="off"/>
            </label>
            <label for="new-pass">
                <span class="label">New Password</span>
                <input type="password" name="newPassword" required="true" autocomplete="off"/>
            </label>
            <label for="conf-new-pass">
                <span class="label">Confirm New Password</span>
                <input type="password" name="confirmNewPassword" required="true" autocomplete="off"/>
            </label>
            <fieldset class="align-center">
                <input class="btn primary" name="submit" type="submit" value="Update"/>
                <a class="btn modalwindow-close">Cancel</a>
            </fieldset>
        </fieldset>
    </form>
    <!-- end password dialog module -->
</div>

Modal.js(Java脚本文件)

$(document).ready(function () 
{
    TEST_APP.Modal($(".modalwindow-open"),{type:'ajax'});
    TEST_APP.AddressPaymentDisplay();
});

TEST_APP.Modal = function (jqueryObj, options) 
{
    if (undefined === $.fancybox){return 'exiting fancybox plugin not loaded';}

    var innerHTMLClz = '.fancybox-inner',
    bypassAjax = false,
    canRefresh = false;

    refreshWindow = function () 
    {
        var refreshInput = $('#refresh_parent');
        if (refreshInput.length >= 1) 
        {
            refreshInput.trigger('click');
        } 
        else 
        {
            //refresh page
            document.location.reload(true);
        }
        canRefresh = false;
    };

$.extend(this.Modal, {
    close: $.fancybox.close,
    update: $.fancybox.update,
    setRefresh: function (bool) 
    {
        if (bool === undefined) {return;}
        canRefresh = bool;
    },
    setBypassAjax: function (bool) 
    {
        if (bool === undefined) {return;}
        bypassAjax = bool;
    },
    setContent: function (data) 
    {
        $(innerHTMLClz).html(data);
    },
    validateModalForm: function (selector) 
    {
        if (undefined === TEST_APP.Validate) {return;}
        var options = {
            submitHandler: function (form) 
            {
                if ($(form).attr('bypassAjax') === 'true' || bypassAjax) 
                {
                    form.submit();
                    return;
                }
                TEST_APP.Ajax(
                {
                    type: 'POST',
                    url: $(form).attr('action'),
                    data: $(form).serializeArray(),
                    success: function (data) 
                    {
                        TEST_APP.Modal.setContent(data);
                        TEST_APP.Modal.update();
                        TEST_APP.Modal.validateModalForm(selector);
                    }
                });
            }
        };
        $(selector, innerHTMLClz).each(function()
        {
            TEST_APP.Validate(this, options);
        });
    }
});

//use some default settings
var settings = {
    fitToView: false,
    scrolling: 'no',
    closeBtn: true,
    minHeight: 0,
    minWidth: 500,
    maxWidth: 537,
    autoWidth:false,
    afterShow: function () 
    {
        TEST_APP.Modal.validateModalForm('form');
    },
    afterClose: function () 
    {
        if (canRefresh) 
        {
            refreshWindow();
        }
    }
};

if (options) {
    $.extend(settings, options);
}

//add compatibility to add non jQuery DOM objects, or selector string
if (!(jqueryObj instanceof jQuery) && jqueryObj !== jQuery)
{
    jqueryObj = $(jqueryObj);
}

//Attach JQuery object to fancy box plugin
jqueryObj.fancybox(settings);

$('.modalwindow-close').live('click', function () 
    {
        TEST_APP.Modal.close();
    });
};

TEST_APP.Alert = function (msg) 
{
    if (undefined === msg){return 'alert message is undefined';}

    var buttons = '<div class="btns align-center"><a class="btn primary confirm-ok">OK</a></div>',
       alertMsg = '<p class="alert_icon">' + msg + '</p>' + buttons;

    TEST_APP.Modal($, {content: alertMsg, modal: true});

    $('.confirm-ok').one('click', function () 
        {
            TEST_APP.Modal.close();
        }
    );
};


TEST_APP.Confirm = function (msg) 
{
    if (undefined === msg){return 'confirm message is undefined';}

    var deferred = $.Deferred(),
         buttons = '<div class="btns align-center"><a class="btn primary confirm-ok">Confirm</a> <a class="btn secondary confirm-cancel">Cancel</a></div>',
      confirmMsg = '<p class="confirmation_icon">' + msg + '</p>' + buttons;

    TEST_APP.Modal($, {content: confirmMsg, modal: true});

    $('.confirm-ok').one('click', function () 
        {
            TEST_APP.Modal.close();
            deferred.resolve();
        }
    );
    $('.confirm-cancel').one('click', function () 
        {
            TEST_APP.Modal.close();
            deferred.reject();
        }
    );

    return deferred.promise();
};

``

0 个答案:

没有答案