Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.09.2014, 11:29
Новичок на форуме
Отправить личное сообщение для Artem_M1507 Посмотреть профиль Найти все сообщения от Artem_M1507
 
Регистрация: 14.09.2014
Сообщений: 6

Выбрать часть ссылки
Всем здрасьте!
Помогите пожалуйста новичку!
Мне необходимо выделить активную кнопку меню. Все бы просто, да не все.
a href в <li> имеет значение (пример) project.php?id=ob_info_vvod_info а вся ссылка http://сайт/mat/project.php?id=ob_info_vvod_info.
Сама процедура выделения активной кнопки стандртна:
var url=document.location.href;  
$.each($(".menu_main.blue a"),function(){   
if(this.href==url){$(this).addClass('blue_on');};  
})


Но затык в переменной url, она не соответствует моему href. Как обрезать url до href ? Навернякапросто, но не нашел нигде доходчивой информации.

Последний раз редактировалось Artem_M1507, 14.09.2014 в 11:32.
Ответить с цитированием
  #2 (permalink)  
Старый 14.09.2014, 12:33
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,584

Это не так. Атрибут "href" содержит именно то что написано, а вот свойство href всегда содержит полную ссылку:

<a href="project.php?id=ob_info_vvod_info">link</a>
<script>
var a = document.querySelector('a');
alert([ 
  'document.location.href = ' + document.location.href,
  'a.getAttribute(\'href\') = ' + a.getAttribute('href'),
  'a.href = ' + a.href
].join('\n'));
</script>
Если же нужно обрезать именно параметры:
alert( 'project.php?id=ob_info_vvod_info'.replace(/\?.*?$/,'') );
__________________
29375, 35

Последний раз редактировалось Aetae, 14.09.2014 в 12:40.
Ответить с цитированием
  #3 (permalink)  
Старый 14.09.2014, 12:58
Новичок на форуме
Отправить личное сообщение для Artem_M1507 Посмотреть профиль Найти все сообщения от Artem_M1507
 
Регистрация: 14.09.2014
Сообщений: 6

Сообщение от Aetae Посмотреть сообщение
Это не так. Атрибут "href" содержит именно то что написано, а вот свойство href всегда содержит полную ссылку:

<a href="project.php?id=ob_info_vvod_info">link</a>
<script>
var a = document.querySelector('a');
alert([ 
  'document.location.href = ' + document.location.href,
  'a.getAttribute(\'href\') = ' + a.getAttribute('href'),
  'a.href = ' + a.href
].join('\n'));
</script>
Если же нужно обрезать именно параметры:
alert( 'project.php?id=ob_info_vvod_info'.replace(/\?.*?$/,'') );
Да, Вы правы. Я уже сделал что хотел, но теперь вопрос стоит с заменой классов. Пришлось извращаться, чтобы "вдавить" кнопку меню вот таким образом:
$(document).ready(function(){ /*Start DocumentReady*/ 
var url= window.location.href;  

$.each($(".menu_main.blue li a"),function(){   
if(this.href==url){
$(this).css({'color' : '#005388',
			'background' : '#ececec',
			'background-position' : '3px 50%',
			'box-shadow' : '0 3px 3px rgba(0, 0, 0, .4) inset'
			});
		}; 
	})
});


А как сделать правильно? Не менять свойства css, а через добавление класса. При добавлении у меня получается какой-то промежуточный результат, т.е. кнопка меняется в цвете, но не "вдавливается", хотя все свойства css указываю. Т.е. если просто заменить класс на все меню, то все ок - одни кнопки меняются на другие, а вот в данном коде как-то не до конца все происходит, наверное что-то нужно удалить, но пробовал удалять все подряд (через removeClass) и - фиг.
Ответить с цитированием
  #4 (permalink)  
Старый 14.09.2014, 13:12
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,584

Очевидно тут вопрос приоритета css. Без всякого js вручную пропишите класс и посмотрите почему он не действует.
__________________
29375, 35
Ответить с цитированием
  #5 (permalink)  
Старый 14.09.2014, 13:21
Новичок на форуме
Отправить личное сообщение для Artem_M1507 Посмотреть профиль Найти все сообщения от Artem_M1507
 
Регистрация: 14.09.2014
Сообщений: 6

Сообщение от Aetae Посмотреть сообщение
Очевидно тут вопрос приоритета css. Без всякого js вручную пропишите класс и посмотрите почему он не действует.
Класс действует правильно если его подключить не чрез jquery
Я совсем еще новичок в джаве, подскажите, пжлст, новый класс должен перекрывать все прежние или прежние надо удалять?

Последний раз редактировалось Artem_M1507, 14.09.2014 в 13:37.
Ответить с цитированием
  #6 (permalink)  
Старый 14.09.2014, 13:37
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,584

js не делает с классми ничего, чего бы вы не делали сами вручную. Разницы в поведении быть не должно. Смотрите в "инспекторе" чем отличается указанный вручную класс от того что навесили через js.
__________________
29375, 35
Ответить с цитированием
  #7 (permalink)  
Старый 14.09.2014, 13:52
Новичок на форуме
Отправить личное сообщение для Artem_M1507 Посмотреть профиль Найти все сообщения от Artem_M1507
 
Регистрация: 14.09.2014
Сообщений: 6

Сообщение от Aetae Посмотреть сообщение
js не делает с классми ничего, чего бы вы не делали сами вручную. Разницы в поведении быть не должно. Смотрите в "инспекторе" чем отличается указанный вручную класс от того что навесили через js.
ок. спасибо.
Ответить с цитированием
  #8 (permalink)  
Старый 14.09.2014, 14:07
Новичок на форуме
Отправить личное сообщение для Artem_M1507 Посмотреть профиль Найти все сообщения от Artem_M1507
 
Регистрация: 14.09.2014
Сообщений: 6

Решил вопрос со стилями - добавил parent() итог:

$(this).parent().addClass('activeLink');
Ответить с цитированием
  #9 (permalink)  
Старый 14.09.2014, 15:36
Новичок на форуме
Отправить личное сообщение для Artem_M1507 Посмотреть профиль Найти все сообщения от Artem_M1507
 
Регистрация: 14.09.2014
Сообщений: 6

3-й день изучаю jquery,а уже решил поделиться опытом (встречал вопрос на просторах инета). В общем сделал вложенное меню. У меня главное меню вертикальное, а доп меню горизонтальное уже в разделе (ну перешел по ссылке и в появившейся рабочей области менюшка раздела... не люблю я эти каскадные меню, поэтому сделал так). Задача стояла не отцепить нажатую кнопку главного меню при нажатии на кнопки вложенной менюшки раздела. В общем решил так:
$(document).ready(function(){ 	
								$.each($(".menu_main.blue li a"),function(){   
									var url2=           window.location.href.slice(window.location.href.indexOf('=')+1,window.location.href.indexOf('=')+5); 
									var link2 = this.href.slice(this.href.indexOf('=')+1, this.href.indexOf('=')+5);
									if(link2==url2){
										$(this).parent().addClass('activeLink');
									}; 
								});
							}); 
							
							
$(document).ready(function(){ 	
								$.each($(".menu_proj li a"),function(){   
									var link = this.href;
									var url= window.location.href;
										if(link==url){
										$(this).parent().addClass('activeLinkproj');
									}; 
								});
							});


Кнопки вложенного меню и главное меню имеют общий корень в хрефе. Например (1 раздел главного меню):
http://сайт/mat/project.php?id=ob_info_vvod_info - это ссылка кнопки главного меню и по совместительству первая вкладка вложенного меню раздела
http://сайт/mat/project.php?id=ob_info_razv - это следующая кнопка вложенного меню.
И т.д. Отличаются они только окончанием, а корень (ob_info) у них общий. Поэтому я решил вырезать из ссылки 4 символа после знака равенства (ob_i, больше не стал, т.к. другие разделы главного чуть короче называются) - это будет маяк для кнопки главного меню (url2=link2), а кнопки вложенного меню (функция №2) будут реагировать на полное совпадение адреса окна и хрефа (URL=href). В итоге ссылка меняется, активные кнопки внутри раздела отмечаются и в главном меню кнопка раздела не отцепляется пока находишься внутри этого самого раздела.
Вот как-то так

Последний раз редактировалось Artem_M1507, 14.09.2014 в 16:16.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не работают ссылки после возвращения ajax tenebrosus jQuery 22 20.06.2014 12:39
Ссылки внутри другой ссылки Madgeniy Events/DOM/Window 4 11.08.2012 14:58
Выбрать часть ссылки с помощью JS. Kirwen Общие вопросы Javascript 10 08.06.2012 00:13
jquery выбрать div с помощью ссылки в нем nioxkzn jQuery 2 02.04.2011 00:40
Меняющаяся часть в скрипте в зависимости от выбранной ссылки. Flashton Элементы интерфейса 1 18.02.2010 18:36