Elepsis Eclipse
Гений
(64039)
4 года назад
В ссылке же всё равно присутствует часть с названием кнопки. Тогда можно не заморачиваться с классами и загружать ссылку в зависимости от innerText кликнутой кнопки. И еще одна переменная, которая будет хранить в себе предыдущую кликнутую... чтобы при повторном клике на то же самое, не перегружало.
________________
$(document).ready(function(){
var prev; // Для хранения предыдущей кликнутой
$('.link').on('click', function(){
$('.link').removeClass('active');
$(this).addClass('active');
if( this.innerText != prev ){
window.location.replace( "mysite.php?lang=" + this.innerText );
prev = this.innerText;
}
});
});
_________
Если кусок ссылки не будет совпадать в названием кнопки, использовать data-* атрибуты...
P.s. там, откуда вы взяли кусок кода... чуть ниже был пример с jQuery)
Константин ЕфименкоГуру (3721)
4 года назад
Проблема в том, что когда я перехожу по кнопкам, либо цикл, либо replace() обновляет страницу при каждом клике. В итоге я не вижу, что кнопка сейчас находится в активном состоянии. Она каждый раз возвращается к началу.
Кроме того, data-* атрибут действительно будет к месту, ведь я не собираюсь ничего писать в кнопке. Я хочу использовать её лишь для визуального оформления. А атрибут data-* применить к тегу <img>, который будет внутри и служить переключателем.
Вообщем то, поэтому и задал вопрос...
Константин ЕфименкоГуру (3721)
4 года назад
Я уже 5 час бьюсь и ни как не соображу, как мне возвратить состояние кнопки после replace(), а главное как прикрутить сюда атрибут data-*.
P.S.: Там, откуда я взял кусок кода, тот пример на jQuery, мне не о чём ровным счётом не говорит. Я кроме одного цикла в нём ничего не вижу, хотя и знаю что их там 2. Тоже самое что писать с завязанными глазами и надеяться на чудо.
Петр Верхов
Мастер
(1291)
4 года назад
Прочитал я уже третий Ваш одинаковый вопрос. Я правильно понял, что Вам просто надо чтобы при открытии страницы с определенным параметром один из дивов был другого цвета (прозрачности, размера, формы и тд (нужное подчеркнуть))?
Это же статика, зачем вам js? PHP решает такие вопросы, да и реализация будет проще:
$lang = $_GET['lang'];
Столбца три или много?
if или switch
switch ($lang) {
case ru:
echo "div class="new" /div div /div div /div"; /*скобочки тут не ставятся надеюсь понятно*/
break;
case kz:
echo "div /div div class="new" /div div /div";
break;
case en:
echo "div /div div /div div class="new" /div";
break;
}
как вариант прикрутить цикл генерации дивов и в нем проверять не равен ли текущий параметр GET-у. В таком варианте я бы вообще предложил значения страны из sql таблички подгружать.
Константин ЕфименкоГуру (3721)
4 года назад
"Я правильно понял,... чтобы при открытии страницы... один из дивов был другого цвета?"
Нет, div лишь контейнер с красивым оформлением, состояние находится на кнопке.
В последнем вопросе уже содержится решение моей проблемы:
$(document).ready(function(){
var current_url = window.location.href;
if (current_url.indexOf('?lang=ru') > 0){
$('.tar-ru').addClass('custom');
}
if (current_url.indexOf('?lang=kz') > 0){
$('.tar-kz').addClass('custom');
}
if (current_url.indexOf('?lang=qz') > 0){
$('.tar-qz').addClass('custom');
}
if (current_url.indexOf('?lang=en') > 0){
$('.tar-en').addClass('custom');
}
});
<script>
function Loc() {
if ($('.active') && $('.ru')) {window.location.replace("mysite.php?lang=ru")}
if ($('.active') && $('.kz')) {window.location.replace("mysite.php?lang=kz")}
if ($('.active') && $('.en')) {window.location.replace("mysite.php?lang=en")}
}
$(document).ready(function(){
let link = $('.link');
for(let i = 0; i < link.length; i++){
link[i].addEventListener('click', function(){
for(let u = 0; u < link.length; u++){
link[u].classList.remove('active');
}
this.classList.add('active');
$(".active").click(Loc);
});
}
});
</script>
<style>
div.lg {display:flex;flex-direction:row;}
.link{opacity: .5;}
.link.active {opacity: 1;}
</style>
<div class="lg">
<button type="button" class="ru link active">ru</button>
<button type="button" class="kz link">kz</button>
<button type="button" class="en link">en</button>
</div>
Нужно чтобы, по нажатию на кнопку соответствующую конкретному классу, переходило на соответствующий псевдосайт. При этом, должно сохраняться состояние нажатия на кнопку, которое оформлено в виде непрозрачности.