Можем ли мы вызвать функцию щелчка на классе div, используя JavaScript

Question

Я реализовал функциональность colorbox в классе div, используя

<script type="text/javascript">
$(document).ready(function(){
$(".exampleclass").colorbox({iframe:true, open:true, width:"50%", height:"50%"});
})
</script>

Теперь я хочу знать, возможно ли из javascript вызвать событие, которое будет динамически открывать colorbox без моего нажатия на элемент div.

Заранее спасибо

Answer 1

См. Функцию Jquery trigger

Триггер Jquery

Answer 2

Абсолютно, Рахул, открыть colorbox через функцию jquery click () легко.Но сначала вам нужно изменить код docReady, чтобы он выглядел примерно так:

$(document).ready(function(){
        $("#example-id").click(function() {
            $(this).colorbox({iframe:true, open:true, width:"50%", height:"50%"})
        });
})

Обратите внимание, что я поместил код с опцией "open: true" в обработчик кликов.Вы, наверное, уже видели, что при запуске этой опции прямо в docReady цветовая коробка открывается при загрузке страницы.

Теперь, когда готов обработчик щелчка, вы можете просто открыть окно с помощью - ну, конечно, щелчка - но динамически с помощью этого кода:

$("#example-id").click();

Где бы вы ни находились, вашColorbox откроется.Таким образом, вы можете поместить его в обработчик успеха или ошибок $ .ajax () или обработчик завершения $ .load ().Кроме того, я использовал обработчик щелчков, но если вам не нужна функциональность щелчков, вы могли бы с такой же легкостью поместить код colorbox в стандартную функцию, а затем вызывать эту функцию всякий раз, когда вам это нужно.

ByКстати, я изменил ваш exampleClass на example-id, потому что, если к обработчику кликов подключено более 1 элемента, произойдет несколько вызовов colorbox.Это не создает проблем, если все классы открывают один и тот же цвет.Если вы заинтересованы в том, чтобы увидеть пример того же класса, открывающего разные цветовые рамки, я могу расширить этот (но сразу начну с простого встраивания атрибутов в теги и их поиска в обработчике кликов).

Последнее замечание: colorbox обычно ассоциируется с тегом, который будет иметь ссылку и заголовок.Это где Colorbox будет получать содержимое и подпись.Вы можете просто добавить теги href и title к себе.Однако валидаторам HTML не понравится href в div, поэтому, если это важно для вас, вам просто нужно добавить его в опции colorbox:

$(this).colorbox({href: "http://stackoverflow.com", iframe:true, ... })

Answer 3

Кроме того, функция, вызываемая по триггеру, должна вызывать ColorBox в режиме, в котором она не назначена элементу.

Таким образом, метод .trigger () вызывает функцию, которая вызывает colorbox, как показано ниже.

$. Colorbox ()

Этот метод позволяет вам вызывать ColorBox без необходимости присваивать его элементу. Пример: $ .colorbox ({href: 'login.php'});

См. Больше в документах colorbox .

Answer 4

Одно из решений jQuery, которое вы можете использовать

$('selector').trigger('click');

, который будет точно работать как обычный щелчок программно.

Обратите внимание, для этого вы должны загрузить JQuery на своей странице. который можно загрузить с одного из серверов CDN.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

Answer 5

Проверить http://api.jquery.com/trigger/

и http://groups.google.com/group/comp.lang.javascript/browse_thread/thread/27e7c70e51ff8a99/98cea9cdf065a524

Answer 6

Вы можете назвать это так:

$.colorbox({iframe:true, open:true, width:"50%", height:"50%"});

Редактировать: Вам может понадобиться запустить это сначала:

$.colorbox.init();