I'm trying to get a click event to go off manual for a plug-in that uses a selector.

plug-in set up.

 $( function ()
            {
                $.contextMenu( {
                    selector: '.context-menu-one',
                    callback: function ( key, options )
                    {
                        var m = "clicked: " + key;
                        window.console && console.log( m ) || alert( m );
                    },
                    items: {
                        "edit": { name: "Edit", icon: "edit" },
                        "cut": { name: "Cut", icon: "cut" },
                        "copy": { name: "Copy", icon: "copy" },
                        "paste": { name: "Paste", icon: "paste" },
                        "delete": { name: "Delete", icon: "delete" },
                        "sep1": "---------",
                        "quit": { name: "Quit", icon: "quit" }
                    }
                } );

                $( '.context-menu-one' ).on( 'click', function ( e )
                {
                    alert( 'clicked', this );
                } )
            } );

I tried two ways to fire but I'm not able to make it work. $( '.context-menu-one' ).trigger( 'click' ); or $( '.context-menu-one' ).click();

Is there a special way to fire on a selector. I figured this was explained somewhere but my searching has reached its end.

--------- update adding more of the surrounding code -----------

 //local functions
    $( function ()
    {//override right click.

        $( this ).bind( "contextmenu", function ( e )
        {
            alert( 1 );// users right clicked
            var overRide = true;

            //set up the right click menu
            $( function ()
            {
                $.contextMenu( {
                    selector: '.context-menu-one',
                    callback: function ( key, options )
                    {
                        var m = "clicked: " + key;
                        window.console && console.log( m ) || alert( m );
                    },
                    items: {
                        "edit": { name: "Edit", icon: "edit" },
                        "cut": { name: "Cut", icon: "cut" },
                        "copy": { name: "Copy", icon: "copy" },
                        "paste": { name: "Paste", icon: "paste" },
                        "delete": { name: "Delete", icon: "delete" },
                        "sep1": "---------",
                        "quit": { name: "Quit", icon: "quit" }
                    }
                } );

                $( '.context-menu-one' ).on( 'click', function ( e )
                {
                    alert( 'clicked', this );
                } )
            } );

            //bring up the menu
            $( '.context-menu-one' ).trigger( {
                type: 'mousedown',
                which: 1
            } );

            if (overRide)  e.preventDefault();
        } );
    } );

My intent here is simply to trigger a right click so that the menu comes up manually not based on an event.

有帮助吗?

解决方案

Based on documentation taken from documentation demo. Following example waits for document to load and after a delay of 1 second programatically opens context menu:

<body>
    <div class="dummyDiv box menu-1"/>
</body>
<script>
$(function(){
    $.contextMenu({
        selector: '.dummyDiv', 
        trigger: 'none',
        items: {
            "edit": {name: "Edit", icon: "edit"},
            "cut": {name: "Cut", icon: "cut"},
            "copy": {name: "Copy", icon: "copy"},
            "paste": {name: "Paste", icon: "paste"},
            "delete": {name: "Delete", icon: "delete"},
            "sep1": "---------",
            "quit": {name: "Quit", icon: "quit"}
        }
    });

    setTimeout(function(){
        $('.dummyDiv').contextMenu();
    }, 1000);       
 });
</script>

其他提示

Try triggering it by:

$('.context-menu-one').trigger({
    type: 'mousedown',
    which: 1
});
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top