Всем привет. Пишу чат. Столкнулся с проблемами ... решил спросить !
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>");
});