0

Здравствуйте!!! Помогите люди добрые, Есть форма поиска RokAjaxSearch, есть карта рисунка со ссылками, мне надо сделать так чтобы при нажатии на ссылку в форму поиска добавился текст ссылки.

Чертеж с указанием деталей

Вот и Html карты рисунка

<IMG SRC="https://i.stack.imgur.com/m89Ce.png" WIDTH=209 HEIGHT=137 BORDER=0 ISMAP USEMAP="#m89Ce.png"><MAP NAME="m89Ce.png"><AREA SHAPE="RECT"COORDS="59,29,132,52"HREF="#1011AA"TARGET="_top"><AREA SHAPE="RECT" COORDS="121,85,199,113" HREF="#1132AD" TARGET="_top"></map>

При нажатии на номер(ссылку) он должен по задумке попасть в форму поиска, дабы не вводить его вручную

1
  • Все верстается на joomle и в кодинге несилен, немного знаю PhP, CSS, Html. Подкину WMoney за помощь в решении вопроса 24 янв 2017 в 19:07

1 ответ 1

0

Вы не на тот ресурс обратились, если хотите, чтоб за вас задачу решали. Вам достаточно прослушивать на клик "area" и вставлять туда куда вам надо.

$('area').on('click', function(e) {
	e.preventDefault();
	$('.here').text(this.getAttribute('href'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<IMG SRC="https://i.stack.imgur.com/m89Ce.png" WIDTH=209 HEIGHT=137 BORDER=0 ISMAP USEMAP="#m89Ce.png"><MAP NAME="m89Ce.png"><AREA SHAPE="RECT"COORDS="59,29,132,52"HREF="#1011AA"TARGET="_top"><AREA SHAPE="RECT" COORDS="121,85,199,113" HREF="#1132AD" TARGET="_top"></MAP>

<div class="here"></div>

Вот пример того же скрипта на чистом js

const area = Array.prototype.slice.call(document.querySelectorAll('area'));

area.forEach(el => {
    el.onclick = e => {
    e.preventDefault();
    document.querySelector('.here').textContent = el.getAttribute('href').replace('#', '');
  }
})
4
  • Я так понимаю необходимо создать *.js с содержимым $('area').on('click', function(e) { e.preventDefault(); $('.here').text(this.getAttribute('href')); }); и после подключить его и jquery.min.js, просмотрел в инспекторе скрипты подключены. А вот куда <div> class="here"> засунуть что-бы он отображался именно в форме поиска. Чуть не забыл скрипт обрабатывается jquery не надо ли заменить в теле скрипта $ на jQuery(area) ? 25 янв 2017 в 1:53
  • Есть возможность помочь разобраться? Условия ваши 25 янв 2017 в 1:57
  • $ это alias jquery. Я без понятий про какой вы поиск говорите. Вы все время про него говорите, но какой у него класс, id вы не сказали. Вам достаточно поменять .here на нужный класс/id. Учитывая, что вы пользуетесь joomla, я думаю у вас и так jquery подключен.
    – DimenSi
    25 янв 2017 в 2:26
  • Вам надо вставить этот скрипт как угодно, можно написать в файл и подключить, а можно вставить в теги <script></script>
    – DimenSi
    25 янв 2017 в 2:27

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.