Как сделать смену картинки по нажатию кнопки
Если новая страница, то зачем JS-сценарий?
автор: Kennen194 (17.12.2015 в 06:32) письмо автору
такое задание. Смысл всего задания это тест.В нем 10 вопросов, варианты ответа должны быть в всплывающем списке. И в зависимости от количества правильных ответов, ставится оценка и на каждую оценку должна быть своя картинка.
Если оценка 2, то одна картинка, если 3 то другая и т.д.
Я сделал чтобы он писал оценку за тест, но в зависимости от оценки (от значения в переменной), должна быть разная картинка.
автор: confirm (17.12.2015 в 15:09) письмо автору
А картинки где, у браузера в кубышке или же все-таки на сервере? Надо полагать что на сервере, в любом случае вы их откуда будете считывать. А если это не делается асинхронным запросом к серверу, то ваш код пустое никчемное занятие, ибо нужно передавать на сервер вариант ответа, а сервер возвращая новую страницу (вы же пишите что открываться должна новая страница) пропишет путь к картинке по результату проверки. Вы бессмыслицей занимаетесь.
автор: KPETuH (17.12.2015 в 10:37) письмо автору
У вас
| ot |
всегда равен 1 судя по коду.
автор: Kennen194 (17.12.2015 в 10:39) письмо автору
я скинул часть кода, где приравнял ot к 1. В полной работе она вычисляется.
Суть не в этом, а в том, как сделать чтобы отображалась картинка на странице (после нажатия кнопки появляется новая страница с рисунком). И в зависимости от полученной ot разный рисунок. Рисунки хранятся на ПК.
автор: coloboc66 (03.01.2016 в 11:56) письмо автору
У вас функция не видит переменных.
Надо их значения либо передавать в функцию параметром, либо получать в теле функции через
document.getElementByID(id) или чем-то подобным.
Как сделать смену картинки по нажатию кнопки
Товарищи, прошу подсказать, как при клике на кнопку — заменить определенную картинку.
$(‘#button’).on(‘click’, function())
как сделать, если забить параметрически:
соответственно кнопка имеет
(4) смысл в том, что у меня много картинок и много кнопок. и каждая кнопка отвечает только за смену 1 картинки
Если у кнопки то $(«#button1»)
можно ли в самой кнопке прописать функцию jquery? и как это сделать?
кнопок может быть много. не на каждую же писать свою процедуру
Если изображения разные, то придется напистаь для каждой.
$(«#my_image»).bind(«click», function() <
$(«#my_image»).attr(«src»,»second.jpg»);
>);
вот это можно написать в теге а не в отдельном блоке?
(10)
допустим, такой html
reactjs вам в помощь.
лучше даже такой селектор написать:
(12) react замороченный. vue гораздо приятнее и чище.
var $bt=$(this) — вот эта штука поймет какую я кнопку нажал?
вот у меня такой код
соответственно, img и button создаются циклом php
.
(15) внутри коллбека события this — это элемент, от которого оно пришло. Ты можешь в теги data-. кнопок напихать данные, какие тебе надо и анализировать в обработчике. Причем, через .data() можно как читать, так и писать данные.
(17) могу в любой тег my-src-change=. закинуть название картинки — у кого требуется сменить src?
спасибо. направление понял
(18) лучше использовать атрибуты data-. Например, data-my-src. Тогда с ними можно работать через метод .data(): .data(‘my-src’)
Курсы javascript
но там две кнопки, а нужно чтобы все работало от одной. При открытии страницы появилась кнопка с картинкой №1, нажал на кнопку — катанка №2 и так при каждом нажатии эти две картинки чередовались межу собой.
Всем спасибо.
02.03.2020, 13:47
Регистрация: 27.05.2010
Сообщений: 33,009
Untitled
02.03.2020, 13:48
Регистрация: 04.12.2012
Сообщений: 3,654
button < max-width: 300px; >img
02.03.2020, 14:02
Регистрация: 08.10.2014
Сообщений: 44
Всем спасибо за быстрый ответ! Сейчас попробую у себя сделать. Только вот проблема с кодом Nexus, при открытии файла в IE, вперёд появляется пустая (без картинки) кнопка, после первого нажатия появляется первый рисунок, потом 2-ой ну и так далее. В Chrome Edge такой проблемы нет. С вариантом рони таких проблем нет во всех 3-х браузерах.
Смена картинок по нажатии на кнопку?
Добрый день, подскажите как найти или сделать так, чтобы при нажатии на кнопку менялись картинки (их 3).
Например, пользователь видит 1 картинку прочитал на ней что-то нажал на кнопку и ту 1 картинку заменяет 2 фотография вновь прочитал что-то, нажал на кнопку и 2 фотографию заменяет 3.
из кода ничего особенного
- Вопрос задан более года назад
- 1335 просмотров
Комментировать
Решения вопроса 2
Старт в WordPress
document.body.addEventListener('click', e => < if (!e.target.matches('button')) return document.querySelector('.pic img').src = e.target.dataset.src document.querySelectorAll('button').forEach(btn =>btn.classList.remove('active')) e.target.classList.add('active') >)Ответ написан более года назад
Комментировать
Нравится Комментировать
Middle Front-end Developer (Vue.js/Nuxt.js)
Сначала составляете массив из ваших картинок, туда вставляете пути к ним.
Далее объявляете кнопку и блок с картинкой куда будете вставлять путь
По клику на кнопку вставляете картинку и при каждом клике увеличиваете переменную на 1, если переменная равна или больше кол-во картинок — обнуляете
Ответ написан более года назад
Комментировать
Нравится Комментировать