从元素中删除 jquery imgareaselect 插件

发布于 2024-08-23 18:05:54 字数 1216 浏览 10 评论 0原文

所以我使用这个简洁的jquery插件 http://odyniec.net/projects/imgareaselect/ 它工作正常,但我用 jquery ui 回调函数(对话框)触发它,并且我需要在对话框关闭后删除选择。

function initialize_selection() {
$('#image_area').imgAreaSelect({ x1: 10, y1: 10, x2: $('#image_area').width()-10, y2: $('#image_area').height()-10 , fadeSpeed: 400, handles: true});
}

$(function() {
$('#image_edit').click(function(){
    $('#edit_image_dialog').load('actions.php?action=edit_temp_image', function(){
            $('#edit_image_dialog').dialog({
                modal: true,
                resizable: false,
                width: 480,
                    buttons: {
            Ok: function() {
                        //foo_bar                                                                        
            },
                        Cancel: function() {
                        //foo_bar
            }
                    },
                    beforeclose: function(){
                    //What should i put here ???
                    ;}
            });
    initialize_selection();
        });
    });
});

我真的很感激一些提示,因为我是 jquery 的新手,我自己无法解决这个问题。

谢谢

So im using this neat jquery plugin http://odyniec.net/projects/imgareaselect/
It works fine, but i'm firing it with jquery ui callback function (dialog), and i need to remove the selection after dialog closes.

function initialize_selection() {
$('#image_area').imgAreaSelect({ x1: 10, y1: 10, x2: $('#image_area').width()-10, y2: $('#image_area').height()-10 , fadeSpeed: 400, handles: true});
}

$(function() {
$('#image_edit').click(function(){
    $('#edit_image_dialog').load('actions.php?action=edit_temp_image', function(){
            $('#edit_image_dialog').dialog({
                modal: true,
                resizable: false,
                width: 480,
                    buttons: {
            Ok: function() {
                        //foo_bar                                                                        
            },
                        Cancel: function() {
                        //foo_bar
            }
                    },
                    beforeclose: function(){
                    //What should i put here ???
                    ;}
            });
    initialize_selection();
        });
    });
});

I would really appreciate some tips, because i'm new to jquery and I can't work this out by myself.

Thank you

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(7

手长情犹 2024-08-30 18:05:54

http://odyniec.net/projects/imgareaselect/usage.html

$('#image_area').imgAreaSelect({remove:true});

应该可以,但是没有把握

http://odyniec.net/projects/imgareaselect/usage.html

$('#image_area').imgAreaSelect({remove:true});

should work, but not sure

咽泪装欢 2024-08-30 18:05:54

我发现删除选择处理区域的唯一方法如下:

"Close": function() { 
  $(".imgareaselect-selection").parent().remove();
  $(".imgareaselect-outer").remove();
  $(this).dialog("close"); 
},

以下内容对我不起作用(在 WordPress 3.0.5 中的 jquery 和 jqueryui 元素中)

$(selector).imgAreaSelect( {remove: true} );

The only way I've found to get the selection treatment areas removed was the following:

"Close": function() { 
  $(".imgareaselect-selection").parent().remove();
  $(".imgareaselect-outer").remove();
  $(this).dialog("close"); 
},

The following did not work for me (in the jquery and jqueryui elements in Wordpress 3.0.5)

$(selector).imgAreaSelect( {remove: true} );
余生一个溪 2024-08-30 18:05:54

这对我有用:

var $ias = $('#imageArea').imgAreaSelect({
    instance: true
});

$('#clearBtn2').click(function() {
    $ias.cancelSelection();
});

This worked for me:

var $ias = $('#imageArea').imgAreaSelect({
    instance: true
});

$('#clearBtn2').click(function() {
    $ias.cancelSelection();
});
泼猴你往哪里跑 2024-08-30 18:05:54

根据 HomeimgAreaSelect Documentation 上的选项文档

$('#image_area').imgAreaSelect( {remove: true} );

即可解决问题

According to the documentation for the options at HomeimgAreaSelect Documentation

$('#image_area').imgAreaSelect( {remove: true} );

will do the trick

野稚 2024-08-30 18:05:54

根据文档: http://odyniec.net/projects/imgareaselect/usage.html

{remove: true} 实际上会完全删除 imgAreaSelect-y-ness。如果您想要做的只是框和灰色区域(但允许用户稍后拖动新框),您需要 {hide: true}。

$('#image_area').imgAreaSelect( {hide: true} );

According to the documentation: http://odyniec.net/projects/imgareaselect/usage.html

{remove: true} will actually remove the imgAreaSelect-y-ness completely. If all you want to do is box and grayed out area, (but allow the user to drag a new box later) you want {hide: true}.

$('#image_area').imgAreaSelect( {hide: true} );
请别遗忘我 2024-08-30 18:05:54
$('#image_area').imgAreaSelect({remove:true}); //For hiding the imagearea
$('#image_area').imgAreaSelect({remove:false}); //For resetting the imagearea

第一个语句隐藏 imgareaselect,第二个语句有助于在下次加载模式时重新加载裁剪功能。

我在从模式返回主窗口时使用了这两个语句,这样下次加载裁剪功能就不会出现问题。

$('#image_area').imgAreaSelect({remove:true}); //For hiding the imagearea
$('#image_area').imgAreaSelect({remove:false}); //For resetting the imagearea

First statement hides the imgareaselect and the second statement helps in reloading the crop functionality when the modal is loaded the next time.

I used both the statements while returning to the main window from the modal so that there is no issue loading the crop functionality next time.

裂开嘴轻声笑有多痛 2024-08-30 18:05:54

是的,它确实有效,但是在 -->$('#image_area').imgAreaSelect({remove:true}); 之后
它无法用于标记其他照片

ya it really work but after -->$('#image_area').imgAreaSelect({remove:true});
It cannot work on tagging other photo

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文