Форум программистов, компьютерный форум, киберфорум
Наши страницы
JavaScript
Войти
Регистрация
Восстановить пароль
 
Newibe
5 / 11 / 4
Регистрация: 02.04.2016
Сообщений: 312
#1

Переделать функцию вывода блоков в универсальную - JavaScript

17.10.2016, 19:22. Просмотров 255. Ответов 15
Метки нет (Все метки)

Доброго времени суток
На сайте отображение вкладок происходит по следующим функциям:
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
var current = 'content_news';
function show(id){
// отключаем отображение всех элементов с классом content
  $('.content').hide(0);
// включаем отображение элемента с идентификатором id
  $('#' + id).show(0);
}
$(document).ready(function(){ 
  show(current);
});
 
var current1 = 'organization';
function show1(id){
// отключаем отображение всех элементов с классом our_text
  $('.our_text').hide(0);
// включаем отображение элемента с идентификатором id
  $('#' + id).show(0);
}
$(document).ready(function(){ 
  show1(current1);
});
 
var current2 = 'video';
function show2(id){
// отключаем отображение всех элементов с классом services_text
  $('.services_text').hide(0);
// включаем отображение элемента с идентификатором id
  $('#' + id).show(0);
}
$(document).ready(function(){ 
  show2(current2);
});
 
var current4 = 'news1';
function show4(id){
// отключаем отображение всех элементов с классом news_text
  $('.news_text').hide(0);
// включаем отображение элемента с идентификатором id
  $('#' + id).show(0);
}
$(document).ready(function(){ 
  show4(current4);
});
Получается так, что на сайте 4 вкладки (меню), на каждой из них несколько подвкладок (подменю). Суть скрипта в том, что он по умолчанию показывает определенную вкладку, а после нажатия на определенную ссылку скрывает в этой вкладке все подвкладки и оставляет только ту, на которую кликнули. Вопрос в том, как переделать функцию таким образом, чтобы она была не для каждой вкладки (класса) отдельная, а единая. То есть, чтобы все работало также, но через одну универсальную функцию.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
17.10.2016, 19:22
Я подобрал для вас темы с готовыми решениями и ответами на вопрос Переделать функцию вывода блоков в универсальную (JavaScript):

Не могу понять как переделать функцию
Всем привет Есть задание: Выкладываю предыдущее задание : function...

Переделать с регулярного выражения в простую функцию Java Script
<!doctype html> <html> <head> <title>Lab 7</title> <meta charset="utf-8"> ...

Создать круг разделенный на 6 блоков, в центре логотип, при наведении на один из блоков он увеличивается
Доброго времени суток. Не знаю, как даже искать похожее. В общем нужно создать...

Создать универсальную функцию для любой DGV
Доброго времени суток Есть одна функция, допустим, functionDGV() и она...

написать универсальную функцию для вычисления выражений
написать универсальную функцию для вычисления выражений(См ниже). В main()...

Переписать универсальную функцию сортировки одномерного массива с Си на паскаль
Собственно требуется помощь, я переписал, но ругается на 42, 52, 53, 54...

15
Newibe
5 / 11 / 4
Регистрация: 02.04.2016
Сообщений: 312
19.10.2016, 07:03  [ТС] #2
Еще актуально
0
Balanaar
834 / 743 / 368
Регистрация: 11.07.2016
Сообщений: 2,218
19.10.2016, 09:23 #3
Пока не вижу проблем:
Javascript
1
2
3
4
5
6
function show(id, class){
// отключаем отображение всех элементов с классом class
  $(class).hide(0);
// включаем отображение элемента с идентификатором id
  $('#' + id).show(0);
}
0
Newibe
5 / 11 / 4
Регистрация: 02.04.2016
Сообщений: 312
21.10.2016, 11:13  [ТС] #4
Не работает. Может я в хтмл коде не правильно прописал вызов функции?
Javascript
1
2
3
4
5
6
7
8
9
10
var current;
function show(id, class){
// отключаем отображение всех элементов с классом content
  $('.content').hide(0);
// включаем отображение элемента с идентификатором id
  $('#' + id).show(0);
}
$(document).ready(function(){ 
  show(current);
});
HTML5
1
2
3
4
5
6
<div class="menu"> 
            <div class="item" id="item_our" onclick="show()"><a href="#content_our">О НАС</a></div>
            <div class="item" id="item_services" onclick="show()"><a href="#content_services">УСЛУГИ</a></div>
            <div class="item" id="item_news" onclick="show()"><a href="#content_news">НОВОСТИ</a></div>    
            <div class="item" id="item_contacts" onclick="show()"><a href="#content_contacts">КОНТАКТЫ</a></div>
        </div>
0
Balanaar
834 / 743 / 368
Регистрация: 11.07.2016
Сообщений: 2,218
21.10.2016, 11:26 #5
Ну естественно не правильно написали вызов функции. Вы объявили функцию show(), принимающую в себя 2 аргумента (id и class), но в вызове функции (onclick="show()") никаких аргументов на вход функции не подаете. Как функция узнает, с чем ей оперировать? Передайте в функцию show() имя класса, который нужно отобразить.

Javascript
1
2
3
4
var current;
$(document).ready(function(){ 
  show(current);
});
Это всё не имеет смысла. current при инициализации страницы не определен. Определите в нем имя класса, блоки с которыми вы хотите отобразить при инициализации страницы.

Javascript
1
2
3
4
5
6
7
8
9
10
var current = 'КЛАСС_КОНТЕНТА';
function show(id){
// отключаем отображение всех элементов с классом content
  $('.content').hide(0);
// включаем отображение элемента с идентификатором id
  $('#' + id).show(0);
}
$(document).ready(function(){ 
  show(current);
});
HTML5
1
2
3
4
5
6
<div class="menu"> 
            <div class="item" id="item_our" onclick="show('КЛАСС_КОНТЕНТА')"><a href="#content_our">О НАС</a></div>
            <div class="item" id="item_services" onclick="show('КЛАСС_КОНТЕНТА')"><a href="#content_services">УСЛУГИ</a></div>
            <div class="item" id="item_news" onclick="show('КЛАСС_КОНТЕНТА')"><a href="#content_news">НОВОСТИ</a></div>    
            <div class="item" id="item_contacts" onclick="show('КЛАСС_КОНТЕНТА')"><a href="#content_contacts">КОНТАКТЫ</a></div>
</div>
0
Newibe
5 / 11 / 4
Регистрация: 02.04.2016
Сообщений: 312
21.10.2016, 13:09  [ТС] #6
Я запутался. так как все-таки правильно, так:
Javascript
1
function show(id){
или так:
Javascript
1
function show(id, class){
и как указывать вызов функции, так:
HTML5
1
onclick="show('show,item_our')
или так
HTML5
1
onclick="show('show')
если у меня class="show"
0
Balanaar
834 / 743 / 368
Регистрация: 11.07.2016
Сообщений: 2,218
21.10.2016, 13:51 #7
покажите, что именно вам нужно скрывать/показывать?
0
Newibe
5 / 11 / 4
Регистрация: 02.04.2016
Сообщений: 312
21.10.2016, 14:17  [ТС] #8
вам лучше ссылку на сайт или выложить код?
0
Balanaar
834 / 743 / 368
Регистрация: 11.07.2016
Сообщений: 2,218
21.10.2016, 14:27 #9
Newibe, без разницы. Главное, чтобы понятно было
0
sad67man
664 / 542 / 335
Регистрация: 23.08.2015
Сообщений: 1,326
21.10.2016, 14:29 #10
Newibe, лучше ссылку на сайт.
0
Newibe
5 / 11 / 4
Регистрация: 02.04.2016
Сообщений: 312
21.10.2016, 14:33  [ТС] #11
http://y91712vc.bget.ru/
0
Balanaar
834 / 743 / 368
Регистрация: 11.07.2016
Сообщений: 2,218
21.10.2016, 14:40 #12
Ну... так а что не работает-то?
0
Newibe
5 / 11 / 4
Регистрация: 02.04.2016
Сообщений: 312
21.10.2016, 14:46  [ТС] #13
Все работает. Но все делается через 4 разные функции. А я хотел оптимизировать так, чтобы все делалось через одну функцию.

Добавлено через 26 секунд
Потому что по сути, функция одна, просто работает с разными классами и id
0
Balanaar
834 / 743 / 368
Регистрация: 11.07.2016
Сообщений: 2,218
21.10.2016, 14:58 #14
Как вариант можно сделать так:
Javascript
1
2
3
4
$('.menu > div').on('click', function() {
    var id = $(this).attr('id').replace('item_', 'content_');
    show(id);
})
Все события onclick на div'ах менюшки можно убирать
0
sad67man
664 / 542 / 335
Регистрация: 23.08.2015
Сообщений: 1,326
21.10.2016, 15:04 #15
Newibe, А теперь скиньте весь ваш код архивом).

Добавлено через 5 минут
Newibe, onclick в любом случае нужно убирать, и вешать обработчики в js скрипте. Я так понимаю вам еще нужно будет сделать так, чтоб при обновлении страницы, сохранялся открытый раздел. Думаю можно работать через адресную строку к примеру в таком виде http://y91712vc.bget.ru/#content_news/news3/ Могу предложить решение, но нужен весь ваш код.
0
Newibe
5 / 11 / 4
Регистрация: 02.04.2016
Сообщений: 312
21.10.2016, 15:11  [ТС] #16
Я так понимаю вам еще нужно будет сделать так, чтоб при обновлении страницы, сохранялся открытый раздел.
Абсолютно верно!
и вешать обработчики в js скрипте
Я не понимаю что это значит. В js вообще не секу, только так, в общих чертах.
0
Вложения
Тип файла: zip archive_2047_1607.zip (5.0 Кб, 2 просмотров)
21.10.2016, 15:11
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
21.10.2016, 15:11
Привет! Вот еще темы с решениями:

Создайте универсальную функцию PrintAnyArr (печать любого массива, кроме усеченных)
Ребят, всем доброго времени суток, нужна ваша помощь) Имеется следующее...

Сделать универсальную функцию, которая может ввести и одномерный и двухмерный массивы
#include &lt;stdio.h&gt; #include &lt;stdlib.h&gt; #include &lt;conio.h&gt; #define N 100 ...

Прошу оценить/дополнить универсальную функцию для добавления/чтения с базы
Доброй ночи. Начинаю изучать тему sql-инъекций. Хотелось бы создать...

Рандомизация вывода блоков
Доброго времени суток. Вопрос следующего порядка: У каждого блока свой класс:...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
16
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru