Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.03.2017, 14:24
Новичок на форуме
Отправить личное сообщение для Zamay Посмотреть профиль Найти все сообщения от Zamay
 
Регистрация: 01.03.2017
Сообщений: 9

Как упростить код и как переключать вкладки ..
Всем привет. Пишу чат. Столкнулся с проблемами ... решил спросить !
http://codepen.io/Zamay/pen/XpEvrN?editors=1010

Написал код , хоть он еще и не полностью работает , но хотел спросить как можно его упрости или переписать! Как по мне он большой. Да и другие варианты реализации тоже интересно посмотреть.

Тоже прошу помочь с кодом. Реализовать нормально удаление и переключение закладок, отправку сообщений. Ну а больше всего это масштабируемые закладки - как в хроме.
Буду благодарен.
$(function () {

    $(".wrap-tab-content div").hide();
    $(".tabs li a").removeClass("active");
    $(".main_menu a").addClass("active");
    $(".wrap-tab-content #main_menu").show();

//Создание закладок
    $(document).on('click', '.user', function () {
        if ($('.wrap-tab-content div').is(this.hash)) {
            $(".wrap-tab-content div").hide();
            $(this.hash).show();

            //.... не переключаются закладки
            return false;
        } else {

            if ($(".tabs li a").length >= 7) {
                alert('Close tabs! Limit 7');
            }
            else {
                //createTab();
                countTabs = parseInt($(".tabs li a").length) + 1;

                $(".wrap-tab-content div").hide();
                $(".tabs li a").removeClass("active");

                $('<li>', {
                    class: 'tab' + (countTabs-1)
                }).appendTo('.tabs');

                $('<a>', {
                    href: this.hash.replace('', ''),
                    text: 'UserMane'// Значение нажатой вкладки слева
                }).appendTo('.tabs li:last').addClass("active");

                $('<i>', {
                    class: 'ion-close-circled'
                }).appendTo('.tabs li a:last');

                $('<div>', {
                    id: this.hash.replace('#', '')
                }).text('New div id: ' + this.hash).appendTo('.wrap-tab-content');
            }
            return false;
        }
    });

//переключение закладок
    $(document).on('click', '.tabs li a', function () {
        $(".wrap-tab-content div").hide();
        $(this.hash).show();
        $(".tabs li a").removeClass("active");
        $(this).addClass("active");

        return false;
    });

  // Удалить 
    $(document).on('click', '.ion-close-circled', function () {
        $(this).closest("li").remove();
        var tabHref = $(this).parent().attr('href');
        $(tabHref).remove();

      //Найти последнию закладку и cделать активной + вывести текст
        var last = $('.tabs li:last-child')[0];
        var a = $(last).children()
        a.addClass("active");

        return false;
    });
});

//отправка сообщения 
$(document).on('click', '#send', function () {
 var text = $('#textarea').val();
 $(".wrap-tab-content ").append("<p>" + text+ "</p>");
  // $(".wrap-tab-content div").after("<p>" + text+ "</p>");
});

Последний раз редактировалось Zamay, 02.03.2017 в 15:32.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Объясните как работает код wolf_ Ваши сайты и скрипты 0 06.08.2014 23:24
Как вызвать свою функцию из «чужого» кода в Java Script, не переписывая «чужой» код? korobochkin Библиотеки/Тулкиты/Фреймворки 2 19.07.2014 16:17
Как вы относитесь к наркоманам? Maxmaxmaximus7 Оффтопик 7 05.02.2014 13:29
Как заставить работать вкладки внутри вкладок Vlasenko Fedor Общие вопросы Javascript 3 10.10.2013 16:14
Как узнать динамический код страницы? gosha13 Общие вопросы Javascript 5 27.07.2009 13:31