jQuery imgAreaSelect hide / show？

我一直试图隐藏并显示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

更改选项后需要更新实例 – 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(); 

Answer 2

我自己从未使用过imgAreaSelect，但是在文档中没有选项show present，但有一个名为hide 。 你试过这个吗？

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

正如BBonifield指出的那样，看起来你必须在更改选项后调用update() 。

或者你可以使用：

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

这将选择所有具有以“imageareaselect-”开头的类并隐藏它们的div 。

Answer 3

API中有取消选择function，因此请按如下方式使用：

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

繁荣！

Answer 4

您不必返回实例并调用API方法。 你可以简单地说：

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

你可以在这里看到所有其他方法调用（官方文档）： http ： //odyniec.net/projects/imgareaselect/usage.html

Answer 5

我尝试了这里提到的所有选项。 没有任何效果。 我期待一些api电话去做。 但它们都没有真正起作用。

我最终像这样手动做：

 $(".imgareaselect-selection").hide(); $(".imgareaselect-outer").hide(); $(".imgareaselect-border1").hide(); $(".imgareaselect-border2").hide(); 

我的页面结构很复杂。 这似乎正在伎俩。