GUI Components JavaScript DHTML

        "http://www.w3.org/TR/html4/strict.dtd">

    
        
        Example 9: Handling Click Events
        
        
        
        
        
        
        
 
        
        
            body { margin:.5em; }
            #logs {
                position:absolute;
                bottom:0;
                right:0;
            
            }
            .example9 {
                background-color:#9c9;
            
            }
        
        
        
        
        
        
            
        
        
        
        
        
        
        
        
        
            YAHOO.example.onWindowLoad = function(p_oEvent) {
                // "click" event handler for a MenuItem instance
                function onMenuItemClick(p_sType, p_aArguments, p_oValue) {
                    YAHOO.log(
                        (
                            "index: " + this.index + 
                            ", text: " + this.cfg.getProperty("text") + 
                            ", value:" + p_oValue
                        ),
                        "info",
                        "example9"
                    );
                
                    this.parent.show();
                
                }
                var oMenu = new YAHOO.widget.Menu("mymenu");
                var oItem1 = 
                        oMenu.addItem(new YAHOO.widget.MenuItem("Item One"));
                oItem1.clickEvent.subscribe(onMenuItemClick);
                var oItem2 = 
                        oMenu.addItem(new YAHOO.widget.MenuItem("Item Two"));
                /*
                     Register a "click" event handler for the first item, 
                     passing a string arguemnt ("foo") to the event handler
                */
                oItem2.clickEvent.subscribe(onMenuItemClick, "foo");
                var oItem2 = 
                        oMenu.addItem(new YAHOO.widget.MenuItem("Item Three"));
                /*
                     Register a "click" event handler for the third item and
                     passing and array as an argument to the event handler
                */
                
                oItem2.clickEvent.subscribe(onMenuItemClick, ["foo", "bar"]);
                oMenu.render(document.body);
    
                oMenu.show();
                var oLogs = document.createElement("div");
                oLogs.id = "logs";
                
                document.body.appendChild(oLogs);
                var oLogReader = new YAHOO.widget.LogReader("logs");
            }
            YAHOO.util.Event.addListener(window, "load", YAHOO.example.onWindowLoad);
            
        
    
    
        

Example 9: Handling Click Events


        

This example demonstrates how to register a "click" event handler for a MenuItem instance.  All of the events for YUI Menu are instances of YAHOO.util.CustomEvent.  To register a listener for an event, use the event's "subscribe" method passing a pointer to your handler as the first argument.  You can pass an argument to your event handler(s) as an additional second argument to the "subscribe" method.


    

           
         
  
yui.zip( 3,714 k)