jQuery imgAreaВыбрать скрыть / показать?

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

Вам нужно обновить экземпляр после изменения опций - 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, кроме той, которая называется hide.Вы пробовали это?

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

Как указывает BBonifield, похоже, вам нужно позвонить update() после изменения параметров.

В качестве альтернативы вы можете использовать:

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

Это выбирает все div с классом, который начинается с "imageareaselect-" и скрывает их.

Answer 3

В API есть функция отмены выбора, поэтому используйте ее так:

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

БУМ!

Answer 4

Я перепробовал все варианты, упомянутые здесь.Ничего не получалось.Я ожидал, что какой-нибудь API-вызов сделает это.Но на самом деле ни один из них не работал.

В итоге я сделал вручную:

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

Моя структура страницы сложная.Это, кажется, делает свое дело.

Answer 5

Вам не нужно возвращать экземпляр и вызывать методы API. Вы можете просто:

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

Вы можете увидеть все другие вызовы методов здесь (официальная документация): http://odyniec.net/projects/imgareaselect/usage.html