Question

在我正在处理的网站上，有一个加载用户控件的弹出窗口。它有三个文本框和一个按钮。我第一次打开对话框时，它工作得很好。但是，如果用户关闭并重新打开它，则不再可单击。对话框显示，但其中没有任何内容可点击。

当IE，Chrome和Safari关闭并重新打开时，此对话框可以正常工作，但Firefox在第二次打开后不允许您执行任何操作。

这是我打开它的javascript代码。

    var $dialogRSVPShortForm;

if( ($dialogRSVPShortForm == null)  ||  ($dialogRSVPShortForm == undefined) || ($dialogRSVPShortForm == "undefined") ) {
    $dialogRSVPShortForm = $j("<div id='rsvpShortFormDlgDivId'></div>")
        .load('/controls/RSVPForm/RSVPShortForm.aspx' + strQS + ' #content')
        .dialog({
            autoOpen: false,
            modal: true,
            draggable: false,
            resizable: false,
            width: 430,
            dialogClass: 'popUpContainer',
            title: $link.attr('title'),
            open: function () {
                jQuery('.ui-widget-overlay').bind('click', function () {
                    jQuery($dialogRSVPShortForm).dialog('close');
                })
            }
        });
    }
    else {
        $j("#rsvpShortFormDlgDivId").load('/controls/RSVPForm/RSVPShortForm.aspx' + strQS + ' #content');
 }
    $dialogRSVPShortForm.dialog('open');
     }

简而言之，$ dialogRSVPShortForm在用户第一次打开对话框时被分配了对话框的新实例。在此之后的任何时间，它都会转到else部分，然后再次打开它，重新加载控件而不是创建对话框的新实例。每次创建一个实例都会在过去引起很多问题，我们不想再这样做了。

这是在对话框中加载的控件。

    <h2>R.S.V.P. For Event</h2>
<table class="rsvpShortForm">
    <tr>
        <td class="label">
            <div class="required">*</div><label for="<%=txtEmail.clientID%>">Email</label>
        </td>
        <td class="field">
            <asp:TextBox ID="txtEmail" runat="server" TextMode="SingleLine" Width="230px"
            onFocus = "if (this.value == 'Email ex: my@email.com') {this.value = ''; this.style.color = '#000';}"
            onBlur = "if (this.value == '') {this.value = 'Email ex: my@email.com'; this.style.color = '#CCC';}"
            value = "Email ex: my@email.com" CssClass = "ghostText" TabIndex="1"/>
             <span class="errorMsg" id="errEmail" style="display: none">Email is required.</span>
            <span class="errorMsg" id="errLegitEmail" style="display: none">Email needs to be valid.</span>
        </td>
    </tr>
    <tr>
        <td class="label">
            <div class="required">*</div><label for="<%=txtPhone.clientID%>">Phone</label>
        </td>
        <td class="field">
            <asp:TextBox ID="txtPhone" runat="server" TextMode="SingleLine" Width="230px" onFocus="if (this.value == 'Phone Number (XXX)-XXX-XXXX') {this.value = ''; this.style.color = '#000';}"
            onBlur="if (this.value == '') {this.value = 'Phone Number (XXX)-XXX-XXXX'; this.style.color = '#CCC';}"
            value="Phone Number (XXX)-XXX-XXXX" CssClass="ghostText" TabIndex="2"/>
            <span class="errorMsg" id="errPhone" style="display: none">Phone is required.</span>
            <span class="errorMsg" id="errValidPhone" style="display:none">Valid phone number required.
            </span>
        </td>
    </tr>
    <tr>
        <td class="label">
            <label for="<%=txtCompany.clientID%>">Company</label>
        </td>
        <td class="field">
            <asp:TextBox ID="txtCompany" runat="server" TextMode="SingleLine" Width="230px" onFocus="if (this.value == 'Your Company') {this.value = ''; this.style.color = '#000';}"
            onBlur="if (this.value == '') {this.value = 'Your Company'; this.style.color = '#CCC';}"
            value="Your Company" CssClass="ghostText" TabIndex="3"/>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <div class="clearbutton"><input type="button" class="globalBTN" ID="btnSubmit" /></div>
     </td>
    </tr>
</table>

我感谢任何帮助。

关闭并在Firefox中重新打开后，JQuery UI对话框弹出窗口无法单击

0 个答案: