Итак, моя проблема в том, что у меня есть две страницы products.html и index.html. на products.html у меня есть несколько изображений и кнопка рядом с каждым изображением, и каждая кнопка соответствует каждому изображению, и когда вы нажимаете кнопку, она ссылается на index.html, а на index.html у меня есть 1 изображение. Я хочу сделать так, чтобы каждый раз, когда я нажимаю кнопку, я попадал на страницу index.html, а соответствующее изображение на products.html помещалось на изображение index.html.
<div class = "imgbx">
<button onclick = "window.location.href='index.html'" >Invisible button</button>
<img src = "images/xr-black.jpg" alt = "">
</div>
это не форма а кнопка
это та же концепция, ссылка будет содержать информацию, которую следующая страница может использовать для отображения своего контента, когда-либо виденного http://example.com?param1=value1¶m2=value2
работает также в href, оформленном как кнопка
Трудно обойтись без какого-либо языка бэкенда, такого как php, asp или java. Вам нужно прочитать параметр URL, как сказал @RichardMuvirimi, и на его основе вам нужно создать html для index.html. Если вы хотите сделать только javascript на стороне браузера, это также возможно, но в этом случае вам нужно подумать намного больше.
Внутри products.html добавьте
<div class = "imgbx">
<button onclick = "window.location.href='index.html?image=images/xr-black.jpg'" >Invisible button</button>
<img src = "images/xr-black.jpg" alt = "">
</div>
В вашем main.html добавьте
<img src = "img" id = "image">
<script>
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const image = urlParams.get('image')
document.getElementById('image').src = image;
</script>
Голосовать было бы полезно
Отвечает ли это на ваш вопрос? передача данных формы на другую HTML-страницу