如何自定义iframe右键弹出

how to customize iframe right click pop-up

本文关键字:右键 iframe 自定义      更新时间:2023-09-26

我在我的应用程序中使用iframe如下,

sample . html

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    </HEAD>
    <SCRIPT LANGUAGE="JavaScript">
    function rightclickdisabled()
    {
    View.document.designMode = 'On'; 
    window.frames["View"].document.oncontextmenu = function(){return false;}; 
    }
    </SCRIPT>
    <BODY onload="rightclickdisabled();">
    <iframe src="" id="View" name="View" style="height: 100px;width: 460px;border: 1px solid #A1A4B5;" />
    </BODY>
    </HTML>

这里我在iframe中禁用右键,它工作得很好。现在我的问题是"是否有可能自定义右键弹出菜单"?

我只需要剪切,复制,粘贴和选择弹出式中的所有选项。

如果我在iframe中禁用右键,我将无法获得任何这些选项。

请帮帮我。

不可以,您不能自定义上下文菜单的内容。你可以完全抑制它,就像你正在做的那样,并且通过一些显著的努力,有可能弹出一个带有自定义选项的模拟菜单,但没有办法在该菜单中包含标准菜单项,如剪切/复制/粘贴,因为没有办法从Javascript触发它们。

我为一家公司制作了这个插件。它是用jQuery构建的。

;(function($){
 // We name the function clicker
 $.fn.clicker = function(options) {
     // Default settings - can be replaced by options
     var defaults = {
         mouse: "click"     // click is an event that contains both the mousedown and mouse up event in one.
     }
     // Extend the options and defaults to variables
     var opts = $.extend(defaults, options);
     // Now start the Function
     return this.each(function() {
         // The original element is defined with a variable
         var element = $(this);
         // We have to define the functions that has to react based on the option 'mouse'
         // So if it is - as standard - set to 'click'
         if (opts.mouse == "click") {
             // ... we want to do a 'click'-function (Basic jQuery)
             // when the element is clicked
             element.click(function(e) {
                 // ... we ensure which mouse button has been pressed
                 switch (e.which) {
                     // ... and execute a function based on that information
                     // Left Mouse Button
                     case 1: left_mouse_command(); break;
                     // Middle Mouse Button
                     case 2: middle_mouse_command(); break;
                     // Right Mouse Button
                     case 3: right_mouse_command(); break;
                 }
                 e.preventDefault();
             });
         // Else if 'mouse' is set to 'mouseup'
         } else if (opts.mouse == "mouseup") {
             // ... we want to do a 'mouseup'-function (Basic jQuery)
             // when the mouse is released from the element
             element.mouseup(function(e) {
                 // ... we ensure which mouse button has been pressed
                 switch (e.which) {
                     // ... and execute a function based on that information
                     // Left Mouse Button
                     case 1: left_mouse_command(); break;
                     // Middle Mouse Button
                     case 2: middle_mouse_command(); break;
                     // Right Mouse Button
                     case 3: right_mouse_command(); break;
                 }
                 e.preventDefault();
             });
         // Else if 'mouse' is set to 'mousedown'
         } else if (opts.mouse == "mousedown") {
             // ... we want to do a 'mousedown'-function (Basic jQuery)
             // when the mouse begins to click on the element
             element.mousedown(function(e) {
                 // ... we ensure which mouse button has been pressed
                 switch (e.which) {
                     // ... and execute a function based on that information
                     // Left Mouse Button
                     case 1: left_mouse_command(); break;
                     // Middle Mouse Button
                     case 2: middle_mouse_command(); break;
                     // Right Mouse Button
                     case 3: right_mouse_command(); break;
                 }
                 e.preventDefault();
             }); 
         }
     });
 }
 })(jQuery);

然后你可以写一个jquery代码像这样:

$(document).ready(function() {
    $('.element').clicker();
});
function right_mouse_command() {
    // Maybe get coordinates from the mouse
    $('div.box').show();
}