jQuery imgAreaSelect hide/show？

Question

我一直试图隐藏并显示imgAreaSelect选择框,具体取决于是否选中了复选框.

我试过了:

    var ias = $('#photo').imgAreaSelect({ instance: true });
    ias.setOptions({ show: false });

但它似乎没有做任何事情.

我不得不诉诸:

    $('div.imgareaselect-selection').hide();
    $('div.imgareaselect-border1').hide();
    $('div.imgareaselect-border2').hide();
    $('div.imgareaselect-border3').hide();
    $('div.imgareaselect-border4').hide();
    $('div.imgareaselect-handle').hide();
    $('div.imgareaselect-outer').hide();

但它似乎有点麻烦,我敢肯定必须有更好的方法.

Answer 1

我自己从未使用imgAreaSelect,但在文档中没有选项show,但有一个名字hide.你试过这个吗？

var ias = $('#photo').imgAreaSelect({ instance: true });
ias.setOptions({ hide: true });
ias.update();

正如BBonifield指出的那样,看起来你必须update()在更改选项后打电话.

或者你可以使用:

$('div[class^=imgareaselect-]').hide();

这将选择所有div具有以"imageareaselect-"开头的类并隐藏它们的s.

Answer 2

更改选项后需要更新实例 - http://odyniec.net/projects/imgareaselect/usage.html#api-methods.虽然事实上,我不确定你是否应该使用{hide:true}或{show:false}.

var ias = $('#photo').imgAreaSelect({ instance: true });
ias.setOptions({ hide: true });
ias.update();