javascript - 按钮点击不会触发

Question

<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button ID="Button1" runat="server" Text="Button" />
        <div id="div1">Click here</div>
    </div>
    </form>

    <script type="text/javascript">
        var $ = function(e) { return document.getElementById(e); };
        var pageDefault = {
            btn1: $('Button1'),

            testfx: function() {
                alert('test');
            },

            init: function() {
                this.btn1.onclick = function() {
                    this.testfx();
                    return false;
                }
            }
        }
        pageDefault.init();
    </script>
</body>

为什么button1点击事件不会触发？

score 4 · Accepted Answer

您可能需要使用$('<%= Button1.ClientID %>')而不是$('Button1'). 有关更多详细信息，请参阅本文。

其他答案中提到的另一个问题是事件处理程序指的this是window. 要解决这个问题，您可以通过以下方式重写您的处理程序：

this.btn1.onclick = function() {
    pageDefault.testfx();
    return false;
}

score 1 · Accepted Answer

this在该部分代码中不在同一范围内。

试试这个

init: function() {
that = this // create's a that variable which refers to the current scope
this.btn1.onclick = function() {
    that.testfx(); // this now points to the scope of pageDefault
    // Same as doing pageDefault.testfx();
    return false;
}

演示

score 0 · Accepted Answer

因为thisin this.testfx(); 不是pageDefault.testfx()isButton1.testfx()

它应该是

this.btn1.onclick = function() {
    pageDefault.testfx();
    return false;
}

score 0 · Accepted Answer

我认为因为 btn1 是一个 jquery 对象。所以使用这个 instade：

init: function() {
                this.btn1.click(function() {
                    this.testfx();
                    return false;
                });
            }

javascript - 按钮点击不会触发

4 回答 4

Related

Reference