帮助调试Ajax服务器控件客户端脚本

Question

我正在用VS2010中的ASP.NET C# 4.0编写一个Ajax服务器控件。

在手工编写javascript prototype类之后，我不知道编译和调试文件的方法。来看看为什么我的"onclick“事件不起作用。

我正在通过继承control & IScriptControl来创建一个Ajax Server控件，并尝试使用onclick事件处理程序。写入的控件实际上是一个"DIV“。有人能告诉我为什么它不工作吗？

谢谢

public class FrebbleSquare : Control, IScriptControl 
    {
.
.
.
IEnumerable<ScriptReference> IScriptControl.GetScriptReferences()
        {
            ScriptReference oRef1 = new ScriptReference("FrebbleAjaxControls.FrebbleSquare.js", this.GetType().Assembly.ToString());
            ScriptReference oRef2 = new ScriptReference("FrebbleAjaxControls.prototype.js", this.GetType().Assembly.ToString());
            ScriptReference oRef3 = new ScriptReference("FrebbleAjaxControls.scriptaculous.js", this.GetType().Assembly.ToString());
            ScriptReference oRef4 = new ScriptReference("FrebbleAjaxControls.effects.js", this.GetType().Assembly.ToString());

            return new ScriptReference[] { oRef1, oRef2, oRef3, oRef4 };
        }


        IEnumerable<ScriptDescriptor> IScriptControl.GetScriptDescriptors()
        {
            ScriptControlDescriptor descriptor = new ScriptControlDescriptor("FrebblesAjax.FrebbleSquare", this.ClientID);

            return new ScriptDescriptor[] { descriptor };
        }

}


JAVASCRIPT CLIENT FILE :


Type.registerNamespace('FrebblesAjax');

FrebblesAjax.FrebbleSquare = function (element) {

    FrebblesAjax.FrebbleSquare.initializeBase(this, [element]);


}


FrebblesAjax.FrebbleSquare.prototype =
{
    initialize: function () {

        FrebblesAjax.FrebbleSquare.callBaseMethod(this, 'initialize');

        this._onclickHandler = Function.createDelegate(this, this._onClick);

        $addHandlers(this.get_element(),
                     { 'click': this._onClick,
                     },
                     this);

    },

    dispose: function () {

        $clearHandlers(this.get_element());

        FrebblesAjax.FrebbleSquare.callBaseMethod(this, 'dispose');
    },

    _onClick: function (e) {

        alert('it worked!');

    }

}


FrebblesAjax.FrebbleSquare.registerClass('FrebblesAjax.FrebbleSquare', Sys.UI.Control);

if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

Answer 1

如果你可以使用火狐，下载Firebug extension。页面加载后，右键单击您创建的元素并选择"inspect element“。这样您就可以看到DOM当前存在的所有结构、属性和函数。在使用JavaScript时，这通常比“查看源代码”更可取。您应该能够在JavaScript调试器中看到绑定了哪些事件处理程序并设置断点。