原型函数未被调用

时间:2012-06-21 17:01:59

标签: html prototypejs

有什么理由说下面的内容不起作用,它似乎适用于除下面的情况之外的每个场景:

我的html / asp.net

<div class="submitContainerConfirm" id="submit_Div">       
    <asp:PlaceHolder runat="server" id="phContinue">
        <asp:ImageButton CausesValidation="false" CssClass="ShowPleaseWait button" runat="server" ID="ibtnContinue" OnClick="ibtnContinue_OnClick" />
    </asp:PlaceHolder>
</div>

我的原型

function pageLoad() {

$$(".ShowPleaseWait").each(function (el) {
    el.observe("click", function (event) {
        if (Page_IsValid) {
            el.hide();
            el.insert({ after: '<img src="/content/images/processing.gif" /> Please Wait...' });
            alert('Is Valid');
        }
        alert('Is not Valid');
    });
});

}

尝试二:

Event.observe(window, 'load', function () {

Event.observe("click", function (event) {
    if (Page_IsValid) {
        event.hide();
        event.insert({ after: '<img src="/content/images/processing.gif" /> Please Wait...' });
        alert('Is Valid');
    }
    alert('Is not Valid');
});

Event.observe("click", function (event) {
    if (Page_IsValid) {
        event.hide();
        event.insert({ after: '<img src="/content/images/processing.gif" /> Processing...' });
        alert('Is Valid');
    }
    alert('Is not Valid');
});

});

//这也不起作用。 请不要jquery。

Example of asp rendered in html + prototypejs bizarrely not working.

2 个答案:

答案 0 :(得分:3)

在您的第二次尝试中,您没有为要监听的element事件指定任何observe,它将如何知道点击了哪个元素?

试试这个:

Event.observe(window, 'load', function() {
    $$('.ShowPleaseWait').each(function(el) {
        el.observe('click', function(ev) {
            if (Page_IsValid) {
                el.hide();
                el.insert({ 
                    after: '<img src="/content/images/processing.gif" /> Please Wait...'
                });

                alert('Is Valid');
            }

            alert('Is not Valid');
        });
    }); 
});

<强>更新

请参阅screenshot of generated page by JSFiddle,这是this小提琴

的直接输出

答案 1 :(得分:1)

很抱歉,我现在无法发表评论,但我现在看到的情况似乎并不会触发Page_IsValid,因为表单没有验证控件。通过使用@epochs JS解决方案,您可以触发预期的结果。

注意:我没有为OnClick事件使用任何EventHandlers

通过添加示例文本框以强制验证发生,查看以下内容是否有帮助...

<div class="submitContainerConfirm" id="submit_Div">       
<asp:PlaceHolder runat="server" id="phContinue">
    <asp:TextBox ID="required" runat="server"></asp:TextBox>
    <asp:RangeValidator
        ID="rangeValidator"
        ErrorMessage="Enter 0-10"
        runat="server"
        MinimumValue="0"
        MaximumValue="10"
        ControlToValidate="required"></asp:RangeValidator>
    <asp:ImageButton CausesValidation="false" CssClass="ShowPleaseWait button" runat="server" ID="ibtnContinue" OnClick="ibtnContinue_OnClick" />
</asp:PlaceHolder>