Coolite官方例子学习笔记二:给按钮添加点击监听

 

给按钮添加点击监听

1、在前台添加一个监听(任何Coolite /Ext控件)

代码:

前台:

<ext:Button ID="Button1" runat="server" Text="按钮 #1" >

                <Listeners>

                    <Click Handler="Ext.Msg.alert('消息框', '你点了按钮1');" />

                </Listeners>

</ext:Button>

 

2、在后台添加监听

后台:

//定义一个JavaScript函数

    string fn2 = "Ext.Msg.alert('消息框','这是后台添加的监听');";

this.Button2.Listeners.Click.Handler = fn2;

 

前台:

<ext:Button ID="Button2" runat="server" Text="后台添加监听">

   </ext:Button>

3、后台监听用 .On() 方法

后台:

    //点击后台监听用 .On() 方法

this.Button3.On("click", "function(){Ext.Msg.alert('消息框','这是后台监听用 .On() 方法');}");

前台:

<ext:Button ID="Button3" runat="server" Text="后台监听用.On()方法">

    </ext:Button>

 

4、后台监听用 .AddListener() 方法

同上3类似

后台:

     //后台监听用 .AddListener() 方法

     this.Button4.AddListener("click", "function(){Ext.Msg.alert('消息框','这是后台监听用 .AddListener() 方法');}");

前台:

    <ext:Button ID="Button4" runat="server" Text="后台监听用 .AddListener() 方法">

    </ext:Button>

 

5、点击一个按钮触发另一个按钮的点击监听

前台:

<ext:Button ID="Button5" runat="server" Text="这是按钮5">

        <Listeners>

            <Click Handler="Button6.on('click',

                         function(){Ext.Msg.alert('消息框', '你已经触发了按钮6')});" />

        </Listeners>

    </ext:Button>

    <ext:Button ID="Button6" runat="server" Text="这是按钮六,要触发先点击按钮5">

    </ext:Button>

 

6、点击监听调用客户端JavaScript函数

     方法一设置“Handler”属性

     方法二设置“Fn”属性

前台:

<script type="text/javascript">

    var myCustomFn = function ShowFn() {

        Ext.Msg.alert('消息框', "你调用了客户端的JavaScript函数");

    }

</script>

 

<ext:Button ID="Button7" runat="server" Text="点击监听调用客户端JavaScript函数(设置”Handler”属性)">

        <Listeners>

            <Click Handler="={myCustomFn}" />

        </Listeners>

</ext:Button>

<ext:Button ID="Button8" runat="server" Text="点击监听调用客户端JavaScript函数(设置“Fn”属性)">

      <Listeners>

          <Click Fn="ShowFn" />

      </Listeners>

</ext:Button>

 

7、点击只触发一次

     前台设置

<ext:Button ID="Button9" runat="server" Text="点击只触发一次">

        <Listeners>

            <Click Fn="ShowFn" Single="true" />

        </Listeners>

 </ext:Button>

     后台设置

//只触发点击监听一次(后台设置)

this.Button10.Listeners.Click.Handler = "Ext.Msg.alert('消息框','只触发点击监听一次(后台设置)');";

this.Button10.Listeners.Click.Single = true;

 

8、2秒后才触发点击监听

     前台设置

<ext:Button ID="Button11" runat="server" Text="两秒后触发点击监听(前台设置)">

        <Listeners>

            <Click Fn="ShowFn" Delay="2000" />

        </Listeners>

</ext:Button>

 

     后台设置

//两秒后触发点击监听(后台设置)

this.Button12.Listeners.Click.Fn = "ShowFn";

this.Button12.Listeners.Click.Delay = 2000;

总结:

    按钮的点击监听,前后台的一些示例。

2009-11-20

posted @ 2009-11-20 15:57  梅子  阅读(1012)  评论(0编辑  收藏  举报