@jake2016

Как выводить объявления при нажатии на пункт списка html?

Есть список с пунктами категорий. Есть объявления, которые будут привязаны к пунктам списка.
5c5a724f3d5d4998952683.jpeg
Вот код списка:
<select class="form2" style=" text-align:center;margin-top:10px;width:650px;max-width:100%; height:50px;" name="rub" id="selector" select="" size="1" onchange="act(this)">
   <option style="font-size:100%;" value="Продам квартиру">Оберіть категорію </option>
   <option value="1">Автотовари</option>
   <option value="2">Одяг та взуття</option>
   <option value="3">Спорт товари</option>
   <option value="4" data-option="3" data-desc="Описание (необязательно)">Все для будинку</option>
   <option value="5" data-option="4" data-desc="Описание (необязательно)">Дитячі товари</option>
   <option value="6" data-option="5" data-desc="Описание (необязательно)">Електроніка</option>
   <option value="7" data-option="6" data-desc="Описание (необязательно)">Прикраси</option>
<option value="8" data-option="7" data-desc="Описание (необязательно)">Догляд і краса</option>
   <option value="9" data-option="8" data-desc="Описание (необязательно)">Тварини</option>
   <option value="10" data-option="9" data-desc="Описание (необязательно)">Продукти харчування</option>
<option value="11" data-option="9" data-desc="Описание (необязательно)">Здоров'я</option>
</select>
<script>
      function act (val) { 
 location.href = "#" + val.value; 
 } 
</script>


Вот код объявлений:
<table style="border:4px solid #ff992f; " class="wpt">
	<tbody>
		<tr>
			<td style="width:200px;"><a href="https://tokmak.today/2019/01/14/hazeta-tokmatska-hryvnia/"><img srcset="https://tokmak.today/wp-content/uploads/2019/01/lohotyp.png 300w,
			 	https://tokmak.today/wp-content/uploads/2019/01/lohotyp.png 1024w" sizes="(max-width: 510px) 200vw, 1024px" src="https://tokmak.today/wp-content/uploads/2019/01/lohotyp.png"><br></td>
			<td style="width:400px;max-width:100%;">
				<h4><strong><a href="https://tokmak.today/2019/01/14/hazeta-tokmatska-hryvnia/">Ваша назва</a></strong></h4>	
				Ваш короткий анонс</td>
			</tr>
		</tbody>
	</table>
<table  class="wpt">
	<tbody>
		<tr>
			<td style="width:200px;"><a href="https://tokmak.today/2019/01/29/fop-iurij-soroka/"><img srcset="https://tokmak.today/wp-content/uploads/2019/01/50853967_236042977333464_3409639098795687936_n.jpg 300w,
			 	https://tokmak.today/wp-content/uploads/2019/01/50853967_236042977333464_3409639098795687936_n.jpg 1024w" sizes="(max-width: 510px) 200vw, 1024px" src="https://tokmak.today/wp-content/uploads/2019/01/50853967_236042977333464_3409639098795687936_n.jpg"><br></td>
			<td style="width:400px;max-width:100%;">
				<h4><strong><a href="https://tokmak.today/2019/01/29/fop-iurij-soroka/">ФОП Юрій Сорока</a></strong></h4>	
				Ноутбуки, компьютеры, планшеты, продажа и ремонт!!!  Фото на документы.</td>
			</tr>
		</tbody>
	</table>


Нужно сделать так чтобы когда выбираешь пункт в списке он показывал объявления привязанные к этому пункту, а остальные убирал. Как это сделать?
  • Вопрос задан
  • 96 просмотров
Решения вопроса 1
AndrewHaze
@AndrewHaze
Умею гуглить яндексом
Получаете value из селекта
$('select').on('change', function() {
  alert( this.value );
});


Повевесте уникальный id на каждую таблицу, и потом показывайте нужную исходя их полученного value
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы