JavaScript примеры

JavaScript

Jquery подразумевается включен.


Перезагрузить страницу на устройстве при смене ориентации экрана.

1
2
3
window.addEventListener("orientationchange", function() {
    location.reload();
}, false);


Определить текущую ссылку сайта и если совпадает с нужной выполнить действие
Вместо fotomain ставите свое значение.

1
2
3
4
<script>
 	if (document.URL == 'http:\/\/' + document.domain + '\/index.php?route=product\/category&path=68'){ document.getElementById('fotomain').style.display = 'block';
	 }
</script>


Добавить jquery класс. Способ добавляет класс одному элементу если выбран #cont и всем элементам если выбран класс .cont Не зная этого можно много времени провести в интернете пытаясь понять почему добавляется класс только первому элементу. Разница лишь в двух знаках «#» — обработает один элемент и «.» — обработает все элементы.

1
2
3
4
<script>
$("#cont").addClass("newclass")	/*добавить класс newclass элементу с идентификатором cont*/
$(".cont").addClass("newclass")	/*добавить класс newclass всем элементам с классом cont */
</script>


Подсветить активную ссылку сайта в меню. Как добавить в li ссылки класс active — класс отвечающий за отображение активной ссылки.

1
2
3
4
5
6
7
8
<script>
$(document).ready(function(){
var url=document.location.href;
 $.each($(".menu li a"),function(){
  if(this.href==url){$(this).parent('li').addClass('active');};
 });
});
</script>


Найти ссылку с определенным названием и присвоить родительскому тегу определенное значение CSS, в данном случае невидим.

1
2
3
<script>
$("a:contains('Проявочные машины')").parent().css("display","none");
</script>


Допустим есть некая форма, в которой есть два выпадающих списка которые выбираются одинаковыми при выключенном чекбоксе и появляется различный выбор при включенном чекбоксе. Обработка чекбокса на чистом js. Обработка идет по порядковому номеру выбранного варианта. Если в первом выпадающем списке выбран вариант то второму выпадающему списку присваивается порядковый номер выбранного варианта из первого списка. Аналогично со вторым выбором.



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script>
  function rename1(){
   if (!document.getElementById("station").checked){		
   var n = document.getElementById("select1").options.selectedIndex;					
   document.getElementById("select2").options.selectedIndex = n;
 }
}
</script>
<script>
  function rename2(){
   if (!document.getElementById("station").checked){
   var n = document.getElementById("select2").options.selectedIndex;									
   document.getElementById("select1").options.selectedIndex = n;
  }
}
</script>


Ставим свои значки в карте сайта Яндекса API 2.1, не забыть подключить скрипт Яндекса.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
ymaps.ready(function () {
    var myMap = new ymaps.Map('map', {
            center: [55.70, 37.62],
            zoom: 10
        }, {
            searchControlProvider: 'yandex#search'
        }),
        myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
            hintContent: 'Первая метка',
            balloonContent: 'Первая метка'
        }, {
            // Опции.
            // Необходимо указать данный тип макета.
            iconLayout: 'default#image',
            // Своё изображение иконки метки.
            iconImageHref: 'assets/templates/rcls/img/spz.png',
            // Размеры метки.
            iconImageSize: [30, 42],
            // Смещение левого верхнего угла иконки относительно
            // её "ножки" (точки привязки).
            iconImageOffset: [-3, -42]
        });        
      var myPlacemark2 = new ymaps.Placemark([55.61, 37.50],
      {
          hintContent: 'Вторая метка',
          balloonContent: 'Вторая метка'
      },
      {
        // Один из двух стандартных макетов
        // меток со значком-картинкой:
        // - default#image - без содержимого;
        // - default#imageWithContent - с текстовым
        // содержимым в значке.
        iconLayout: 'default#image',
        iconImageHref: 'assets/templates/rcls/img/spz.png',
        iconImageSize: [30, 42],
        iconImageOffset: [-3, -42]
      });
    myMap.geoObjects.add(myPlacemark);
    myMap.geoObjects.add(myPlacemark2);
});


Как узнать установлена ли галочка chekbox
Как снять галочку чекбокс
Как установить значение для чекбокса


Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *