Ajax. Воспроизведение видео YouTube по вынесенной кнопке без перезагрузки страницы

@Александра99999 · Регистрация: 06.11.2015

Студворк — интернет-сервис помощи студентам

Здравствуйте!
Есть кнопка

<div class="button" id="button">Воспроизвести</div>

и айфрейм форма с видео

<iframe width="854" height="480" onclick="return false" src="https://www.youtube.com/embed/mDGhHyhGaWs?rel=0&enablejsapi=1 ;" frameborder="0" allowfullscreen id="yplayer"></iframe>

Видео воспроизводится по нажатию на эту кнопку. Скажите пожалуйста, возможно ли воспроизводить это видео без перезагрузки страницы? Точнее как это сделать? Подозреваю, что нужно использовать ajax, но составить запрос не получается :/

На всякий случай код воспроизведения виде по кнопке:

<script>
$(document).on('click', '.button', function() {
var $video = $('#yplayer'),
src = $video.attr('src');

$video.attr('src', src + '&autoplay=1');
});
function myFunction() {
document.getElementById("button").c lick(); // Click on the checkbox
}

</script>

@msheal · 17.08.2017, 00:54

Здесь не нужно никаких аяксов, а лишь апи ютуб плеера. Набросал простенький пример для вашего конкретного случая: https://codepen.io/msheal/pen/MvryGO

Вот собственно и само апи ютуба: https://developers.google.com/... _reference

@Александра99999 · 17.08.2017, 01:43 **[ТС]**

Спасибо Вам огромнейшее!

Новые блоги и статьи Все статьи Все блоги /
Тестирование Pull Request в Kubernetes с vCluster Mr. Docker 19.07.2025 Часто сталкиваюсь с серьезной дилемой при настройке тестовых окружений для проверки Pull Request в Kubernetes. С одной стороны, каждый PR требует изолированной среды — только так можно гарантировать,. . .	Мой 7 минутный ролик с крамольным предложением про шахматы, предлагаю заценить _Ivana 18.07.2025 p2UhJNMGY94	Десять Middleware Node.js для эффективного кодинга Reangularity 18.07.2025 Когда я только начинал работать с Node. js, количество пакетов в npm меня буквально парализовало. Сегодня их больше 1,3 миллиона — попробуй разберись, что стоит твоего внимания, а что нет. Я потратил. . .	Context и глубины Android mobDevWorks 18.07.2025 В Android разработки Context напоминает воздух - он везде, жизненно необходим, но мало кто может детально объяснить его природу. Мы привыкли получать его как параметр, передавать дальше и. . .	Результаты исследования от команды MCM (июль 2025 г.) Programma_Boinc 18.07.2025 Результаты исследования от команды MCM (июль 2025 г. ) Как сообщалось в наших предыдущих публикациях, мы изучаем гены, которые имеют наибольший рейтинг и ассоциируются с различными видами рака, в. . .
ИИ-чатбот на React с OpenAI и LangChain.js Reangularity 17.07.2025 React давно стал для меня золотым стандартом фронтенд-разработки. Его компонентная структура, виртуальный DOM и однонаправленный поток данных идеально подходят для создания динамичных интерфейсов. . .	Пишем адаптер для локального хранилища S3 на C# stackOverflow 16.07.2025 Разработка современных приложений часто требует интеграции с объектными хранилищами, и Amazon S3 стал де-факто стандартом в этой области. Однако работа с облачными сервисами в процессе разработки. . .	Старые замки kumehtar 16.07.2025 Смотрел тут фото, попались пара старых замков. И сразу бросилось в глаза из отличие. Например: Замок Бистон, в англии. Разрушенное сооружение. Но - не испорченное людьми, по крайней мере - на. . .	Java и Eclipse Store: Сверхбыстрые приложения с In-Memory DB Javaican 15.07.2025 Eclipse Store — это микро-движок персистентности для Java, который позволяет хранить и извлекать нативные Java-объекты без необходимости преобразования данных или использования объектно-реляционного. . .	EmBitz, создание проекта, отладка, прошивка locm 15.07.2025 Создание проекта для Blue Pill (STM32F103C8T6) в EmBitz 2. 30, написания кода blink, запуск отладки в ОЗУ, заливка релизной прошивки во flash используя ST-Link и др. . . .

@Александра99999 0 / 0 / 0 Регистрация: 06.11.2015 Сообщений: 6

	Ajax. Воспроизведение видео YouTube по вынесенной кнопке без перезагрузки страницы 16.08.2017, 19:21. Показов 1370. Ответов 2 Метки нет (Все метки) Здравствуйте! Есть кнопка <div class="button" id="button">Воспроизвести</div> и айфрейм форма с видео <iframe width="854" height="480" onclick="return false" src="https://www.youtube.com/embed/mDGhHyhGaWs?rel=0&enablejsapi=1 ;" frameborder="0" allowfullscreen id="yplayer"></iframe> Видео воспроизводится по нажатию на эту кнопку. Скажите пожалуйста, возможно ли воспроизводить это видео без перезагрузки страницы? Точнее как это сделать? Подозреваю, что нужно использовать ajax, но составить запрос не получается :/ На всякий случай код воспроизведения виде по кнопке: <script> $(document).on('click', '.button', function() { var $video = $('#yplayer'), src = $video.attr('src'); $video.attr('src', src + '&autoplay=1'); }); function myFunction() { document.getElementById("button").c lick(); // Click on the checkbox } </script> 0

@msheal 707 / 309 / 191 Регистрация: 05.03.2015 Сообщений: 822
	17.08.2017, 00:54
	Здесь не нужно никаких аяксов, а лишь апи ютуб плеера. Набросал простенький пример для вашего конкретного случая: https://codepen.io/msheal/pen/MvryGO Вот собственно и само апи ютуба: https://developers.google.com/... _reference 0

@Александра99999 0 / 0 / 0 Регистрация: 06.11.2015 Сообщений: 6
	17.08.2017, 01:43 [ТС]
	Спасибо Вам огромнейшее! 0

Опции темы