Обработка события через jQuery

@Ramzan_95 · Регистрация: 15.04.2018

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

Всем привет

Это то что есть в html файле

HTML5
1
<a class = "classA" href = "show.html" onclick = "onclickDivergent2()"><img src = "assets/img/Divergent2.jpg" alt = "дивергент, глава 2">

Этот код в JavaScript

JavaScript
1
2
3
function onclickDivergent2(){
    $('#htpsjt').attr('src', 'https://www.youtube.com/embed/LNaph4ub6pI');
}

При переходе по ссылке, ссылка не меняется.

JavaScript
1
$('#htpsjt').attr('src', 'https://www.youtube.com/embed/LNaph4ub6pI');

этот кусок кода работает без функции, а так же в функции работает другой код, например: alert.
В итоге получается, что этот код не подходит друг другу, или нужно как-то видоизменить, или же придумать другой способ.

Я перепробовал много функций, уже 4 дня пытаюсь решить эту проблему.

Буду рад любой оказанной помощи.

@Ramzan_95 · 09.01.2020, 21:01 **[ТС]**

Всем привет

Этот код лежит в index.html файле

HTML5
1
<a class = "classA" href = "show.html" onclick = "onclickDivergent2()"><img src = "assets/img/Divergent2.jpg" alt = "дивергент, глава 2">

Этот код лежит в файле show.html

HTML5
1
<iframe id = "htpsjt" class = "embed-responsive-item" src="https://www.youtube.com/embed/Kj8vhIjUXmM?list=PLO7FUJHSsKrCLrn8tNaUdVrf-ku2rO7YQ" frameborder="0" allowfullscreen></iframe >

Этот код лежит в файле script.js

JavaScript
1
2
3
function onclickDivergent2(){
    $('#htpsjt').attr('src', 'https://www.youtube.com/embed/LNaph4ub6pI');
}

При переходе по ссылке с файле index.html в файл show.html видео не загружается в iframe
________________________________________ ________________________________________ _

JavaScript
1
$('#htpsjt').attr('src', 'https://www.youtube.com/embed/LNaph4ub6pI');

этот кусок кода работает без функции, я проверял, выносил его за функцию.

Функция так же рабочая, я проверил другим куском кода, таким как: alert.

Я не знаю в чем дело в функции или в jQuery

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

Буду рад любой оказанной помощи.

@amr-now · 10.01.2020, 09:18

Здравствуйте.
Ramzan_95, где находится $('#htpsjt') ?
На этой странице или на другой странице show.html ?
Если ссылка с фильмом на этой странице, то переход по classA не делаем и остаемся на этой странице:

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
 
<body>
    <a class="classA" href="show.html">
        <img src="assets/img/Divergent2.jpg" alt="дивергент, глава 2">
    </a>
    <a id="htpsjt">Сссылка на фильм</a>
    <script>
        $('.classA', 0).click(onclickDivergent2); // Правильнее - в скрипте навешивать обработчик
 
        function onclickDivergent2(e) {
            e.preventDefault(); // Отменить переход по ссылке, если просто хотим поменять другую ссылку
 
            $('#htpsjt')[0].href = 'https://www.youtube.com/embed/LNaph4ub6pI';
        }
    </script>
</body>
</html>

Если нам действительно нужно перейти на show.html,
то даже скрипт не нужен. Например так:

HTML5
1
2
3
<a class = "classA" href = "show.html?id=LNaph4ub6pI" >
<img src = "assets/img/Divergent2.jpg" alt = "дивергент, глава 2">
</a>

@Ramzan_95 · 10.01.2020, 11:53 **[ТС]**

...

Добавлено через 11 минут
Объясню саму задачу. Я хочу сделать сайт кинопортал для просмотра фильмов, так как у меня нет знания в базе данных, я использую ссылки на сторонние ресурсы. Мне нужно что бы при нажатии на изображение(которое является ссылкой), я перешел на с основной страницы index.html на вторую страницу show.html.

А после перехода мне естественно нужно, что бы выполнилось событие, и что бы это событие меняло ссылку у атрибута iframe, которая находится на второй странице show.html, на которую я перешёл нажав на изображение(которое является ссылкой).

Если вынести код, который выполняет замену адреса за функцию, код начинает работать.

Так же при включении в функцию другого кода, она работает.

И не понятная ситуация получается, как то так.

@amr-now · 10.01.2020, 17:20

Ramzan_95, так и получается у вас таблица:
- ID
- адрес картинки
- url фильма

На первой странице нажимаем на картинку с фильмом "Дивергент". Его порядковый номер в вашей таблице - 123.

А на этой ссылке уже был готовый статичный HTML-участок:

HTML5
1
2
3
<a class = "classA" href = "show.html?id=123" >
<img src = "assets/img/Divergent2.jpg" alt = "дивергент, глава 2">
</a>

Сервер получил в запросе URL /show.html?id=123
И по ID=123 подобрал url фильма из таблицы и сформировал специальным образом ответ show.html, на которой открывается данный фильм.

Добавлено через 7 минут
----
Кстати если уровень программирования - детский сад, то можно обойтись кучкой HTML-файлов:

HTML5
1
2
3
<a class = "classA" href = "show123.html" >
<img src = "assets/img/Divergent2.jpg" alt = "дивергент, глава 2">
</a>

где ID фильма из таблицы вбит непосредственно в название html-файла. И даже сервер не будет нужен.

@Ramzan_95 · 10.01.2020, 20:03 **[ТС]**

Я извиняюсь за свою неграмотность в программировании. Можете коротко объяснить ещё раз, по проще, что бы я знал куда копать надо.

Не надо весь код расписывать, просто скажите что именно не так, я начинающий программист, плохо знаю все эти процессы

Добавлено через 7 минут
Я заметил что у меня не хочет работать код на jquery в функциях, не важно на javaScript написан или на jquery. А когда выносишь за функцию они начинают работать

@fanatikus · 11.01.2020, 14:26

index. php

HTML5
1
<a class = "classA" href = "show.html?f=f_1"><img src = "assets/img/Divergent2.jpg" alt = "дивергент, глава 2"></a>

show.php

PHP/HTML
1
2
3
4
5
6
7
8
<?php 
$config_films = array(
    'f_1' => 'www.youtube.com/embed/LNaph4ub6pI',
    'f_2' => 'www.youtube.com/embed/adruerDREf'
);
?>
        
<iframe id = "htpsjt" class = "embed-responsive-item" src="<?php echo $config_films[$_GET['f']]; ?>" frameborder="0" allowfullscreen></iframe >

но это все г.......код
нужна база данных

@amr-now · 11.01.2020, 15:04

fanatikus, тем более, что Ramzan_95 скорее всего не изучал PHP.

Добавлено через 7 минут
----
Идея не покидать единственную страницу из моего сообщения №3 вполне работоспособная.
Вверху например оставляем прямоугольник для видео,
а список фильмов будет внизу.

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

@fanatikus · 11.01.2020, 15:04

Сообщение от amr-now

скорее всего не изучал PHP.

тогда

Сообщение от amr-now

можно обойтись кучкой HTML-файлов:

а вообще для создания

Сообщение от Ramzan_95

сайт кинопортал для просмотра фильмов,

знания одного html явно маловато
может не бежать впереди паровоза?

@amr-now · 11.01.2020, 15:08

fanatikus, душа просит чего-нибудь глобального. "Чтоб все" (С)

@Ramzan_95 · 11.01.2020, 15:33 **[ТС]**

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

@fanatikus · 11.01.2020, 15:47

Сообщение от amr-now

душа просит чего-нибудь глобального.

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

Добавлено через 11 минут
еще вариант

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
<script>
    function showFilm(link) {
       let html = '<iframe class = "embed-responsive-item" src="' + link + '" frameborder="0" allowfullscreen></iframe >';
 
        $('#htpsjt').html(html);
    }
</script>
 
<a class="classA" onclick="showFilm('https://www.youtube.com/embed/LNaph4ub6pI'); return false;">
    <img src="assets/img/Divergent2.jpg" alt="дивергент, глава 2">
</a>
 
<div id="htpsjt"></div>

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

Обработка события через jQuery

Решение

Решение

Решение

Решение

Решение

Решение

@Ramzan_95 5 / 5 / 0 Регистрация: 15.04.2018 Сообщений: 103
	10.01.2020, 11:53 [ТС]
	... Добавлено через 11 минут Объясню саму задачу. Я хочу сделать сайт кинопортал для просмотра фильмов, так как у меня нет знания в базе данных, я использую ссылки на сторонние ресурсы. Мне нужно что бы при нажатии на изображение(которое является ссылкой), я перешел на с основной страницы index.html на вторую страницу show.html. А после перехода мне естественно нужно, что бы выполнилось событие, и что бы это событие меняло ссылку у атрибута iframe, которая находится на второй странице show.html, на которую я перешёл нажав на изображение(которое является ссылкой). Если вынести код, который выполняет замену адреса за функцию, код начинает работать. Так же при включении в функцию другого кода, она работает. И не понятная ситуация получается, как то так. 0

@Ramzan_95 5 / 5 / 0 Регистрация: 15.04.2018 Сообщений: 103
	10.01.2020, 20:03 [ТС]
	Я извиняюсь за свою неграмотность в программировании. Можете коротко объяснить ещё раз, по проще, что бы я знал куда копать надо. Не надо весь код расписывать, просто скажите что именно не так, я начинающий программист, плохо знаю все эти процессы Добавлено через 7 минут Я заметил что у меня не хочет работать код на jquery в функциях, не важно на javaScript написан или на jquery. А когда выносишь за функцию они начинают работать 0

@amr-now 6496 / 3907 / 2006 Регистрация: 14.06.2018 Сообщений: 6,781
	11.01.2020, 15:04
	Сообщение было отмечено Ramzan_95 как решение Решение fanatikus, тем более, что Ramzan_95 скорее всего не изучал PHP. Добавлено через 7 минут ---- Идея не покидать единственную страницу из моего сообщения №3 вполне работоспособная. Вверху например оставляем прямоугольник для видео, а список фильмов будет внизу. Вполне простенький и работоспособный вариант для новичка, никогда ранее не использовавшего сервер. 1

@amr-now 6496 / 3907 / 2006 Регистрация: 14.06.2018 Сообщений: 6,781
	11.01.2020, 15:08
	Сообщение было отмечено Ramzan_95 как решение Решение fanatikus, душа просит чего-нибудь глобального. "Чтоб все" (С) 2

@Ramzan_95 5 / 5 / 0 Регистрация: 15.04.2018 Сообщений: 103
	11.01.2020, 15:33 [ТС]
	Я понял, спасибо. Насчет того что бы на одной странице было, так и сделаю. Потом если, что можно будет оптимизировать код 1