JavaScript DHTML/Ext JS/Context Menu

Материал из Web эксперт
Перейти к: навигация, поиск

Catch event before browser context menu be displayed

   <source lang="html4strict">

<html> <head> <title>Hello World Window</title> <link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /> <script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="ext-3.0.0/ext-all.js"></script> </head> <body> <script type="text/javascript"> Ext.onReady(function() {


Ext.get("div1").on("contextmenu", function(eventObj, elRef) { 

   alert("div1 contextmenu Handler, source elment ID: " + elRef.id);

});

}); </script>

asdf

</body> </html> 

 </source>


Replace browser context menu

   <source lang="html4strict">

<html> <head> <title>Hello World Window</title> <link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /> <script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="ext-3.0.0/ext-all.js"></script> </head> <body> <script type="text/javascript"> Ext.onReady(function() { 

   Ext.get("div1").on("contextmenu", function(eventObj, elRef) {
       eventObj.stopEvent();
       if (!this.ctxMenu) {
           this.ctxMenu = new Ext.menu.Menu({
               items : [{
                   text : "A"
               },{
                   text : "B"
               },{
                   text : "C"
               }]
           });
       }
       this.ctxMenu.show(elRef);
   });

}); </script>

asdf

</body> </html> 

 </source>


Set context menu to div tag

   <source lang="html4strict">

<html> <head> <title>Hello World Window</title> <link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /> <script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="ext-3.0.0/ext-all.js"></script> </head> <body> <script type="text/javascript"> Ext.onReady(function() { 

   Ext.get("div1").on("contextmenu", function(eventObj, elRef) {
       eventObj.stopEvent();
       if (!this.ctxMenu) {
           this.ctxMenu = new Ext.menu.Menu({
               items : [{
                   text : "A"
               },{
                   text : "B"
               },{
                   text : "C"
               }]
           });
       }
       this.ctxMenu.show(elRef);
   });

}); </script>

asdf

</body> </html> 

 </source>
Источник — «http://wbex.ru/index.php?title=JavaScript_DHTML/Ext_JS/Context_Menu&oldid=2391»