jQuery, когда выбран элемент списка, добавить в текущий класс div

Question

У меня есть раскрывающийся список jQuery для выбора языка. На данный момент у меня есть скелетная настройка того, как это работает, но я довольно смущен тем, как запустить активную функцию jQuery.

Что я хочу сделать, когда пользователь нажмет язык из списка, имя языка (или в будущем флаг) появится вверху в «текущем классе div».

По умолчанию, которое было бы в текущем классе, будет элемент английского списка.

Я не уверен, как это начать, но из исследования я обнаружил, что могу создать if statement и использовать элементы append/prepend? Я иду в правильном направлении?

Я использую CodeIgniter и создал язык переводчика, так внутри иметь HTML якоря теги мой PHP написано так:

<li id="french"><?php echo anchor('fr/'.strtolower($page_info['fr_title']), 'FR'); ?></li> 

Вот ссылка на грубый прототип, как это в настоящее время создана. Любые учебники или рекомендации будут оценены.

Если язык является французским дисплеем французского флага и так далее:

$(function() { 
    if (document.location.href.indexOf('en') > -1) { 
     alert('english'); 
    } else { 
     if (document.location.href.indexOf('ru') > -1) { 
      alert('russian'); 
     }else { 
      if (document.location.href.indexOf('fr') > -1) { 
       alert('french'); 
      }else { 
       if (document.location.href.indexOf('fr') > -1) { 
        alert('french');  
        } 
       } 
      } 
     } 
    }); 

Спасибо!

Ссылка: http://jsfiddle.net/Wmb4n/2/

Answer 1

проверить это fiddle

$('#lang_selector ul li').click(function() { 
    $('.current').text($(this).text());  
}); 

EDIT: Ваши заявления if.. else необходимо очистить.

$('#lang_selector ul li').click(function() { 
    $('.current').text($(this).text()); 
var loc = document.location.href; 
    if (loc.indexOf('en') > -1) { 
     alert('english'); 
    } else if (loc.indexOf('ru') > -1) { 
     alert('russian'); 
    } else if (loc.indexOf('fr') > -1) { 
     alert('french'); 
    } else if (loc.indexOf('fr') > -1) { 
     alert('french'); 
    } 
}); 

Answer 2

не уверен, если это то, что вы хотите ..

попробовать его ..

$(document).ready(function(){ 
    $('.current').click(function(){ 
    $(this).siblings('ul').slideToggle(); 
}); 
    $('ul li').click(function(){ 
     $(this).parent().prev('span').text($(this).text()); 
    }); 
}); 

fiddle here

Answer 3

ИТАК user1671639 ответил на мой вопрос выше, но другой вопрос в том, что эта страница была освежающие с новым содержанием языка, который означает, что выбранный DIV мерцает перед тем загрузки страницы. Я также пробовал $('#lang_selector ul li').click(function (e) { $('.current').text($(this).text()); e.preventDefault(); });

Что сохранил выбранный элемент, но не обновлял страницу с содержанием языка.

Я не уверен, что это правильный способ сделать это, но если кто-нибудь может подумать о более простом решении, которое было бы здорово.

Я добавил ссылку на мой скрипт, но не буду работать, поскольку изображения и php не включены в него. В основном, когда пользователь выбирает значок в списке, страница обновляется, а затем jQuery проверяет, имеет ли url fr или enct, и если это так добавляет li id ​​= французский с изображением на текущий диапазон.

Ссылка: http://jsfiddle.net/Wmb4n/7/

Это работает:

$(function() { 
    var loc = document.location.href; 

     if (loc.indexOf('en') > -1) { 
      $("span.current").append(english); 

     } else if (loc.indexOf('ru') > -1) { 
      $("span.current").append(russian); 

     } else if (loc.indexOf('fr') > -1) { 
      $("span.current").append(french); 

     } else if (loc.indexOf('de') > -1) { 
      $("span.current").append(german); 
     } 
    }); 

Чтобы изменить язык перевода в теге привязки заключается в следующем:

<?php echo anchor('fr/'.strtolower($page_info['fr_title']), 'FR'); ?>