jQuery imgAreaSelect Скрыть / показать?

Я пытался скрыть и показать 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();

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

6
jquery jquery-plugins

5 ответов

вам нужно обновить экземпляр после изменения параметров -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();
6

Я никогда не использовал imgAreaSelect себя, но в docs нет опции show присутствует, но никто по имени hide. Ты пробовал?

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

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

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

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

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

5

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

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

бум!

1

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

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

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

0

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

Я закончил делать вручную, как это:

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

структура моей страницы сложна. Кажется, это помогает.

0