Форум

Lion_astana · #1 (**permalink**) 26.12.2013, 09:40

function catCols() {
             var bodyWidth = $('body').width();
                         
            if (bodyWidth < 601) {
                if(#my_div.hasClass('c_100') != true){
                    Тут код 1 ...               
                };
            };
            if (bodyWidth > 600 && bodyWidth < 1001) {
                if(#my_div.hasClass('c_50') != true){
                    Тут код 2 ...               
                };
            };
            if (bodyWidth > 1000 && bodyWidth < 1601) {
                if(#my_div.hasClass('c_33') != true){
                    Тут код 3 ...   
                    
                };
            };
            if (bodyWidth > 1600) {
                if(#my_div.hasClass('c_25') != true){
                    Тут код 4 ...   
                    
                };
            };
        };

В тех местах где написано "Тут код 1", "Тут код 2" и т.д. прописаны различные команды и функции. Есть вещи, которые должны работать на всех страницах сайта, например меню и т.п. НО! На некоторых страницах есть дополнительные функции, которые нужны только на этой конкретной странице, и мне кажется что нет смысла таскать все это в одном общем файле.

Как сделать так, чтобы на некоторых страницах описывать функции для этих страниц и затем добавлять их в общий скрипт с меню и теми вещами которые есть на всех страницах в места "Тут код 1", "Тут код 2" и т.д.?

Надеюсь вы поймете о чем я, если нет, напишите, попробую яснее объяснить.

Заранее благодарю всех за конструктивные предложения.

ksa · #2 (**permalink**) 26.12.2013, 10:55

Сообщение от Lion_astana

Как сделать так, чтобы на некоторых страницах описывать функции для этих страниц и затем добавлять их в общий скрипт с меню и теми вещами которые есть на всех страницах в места "Тут код 1", "Тут код 2" и т.д.?

Как вариант...

(function (){
	if (window.test!==undefined) {test()};
	if (window.test1!==undefined) {test1()};
})();
function test1() {
	alert('ok');
};

Vlasenko Fedor · #3 (**permalink**) 26.12.2013, 13:20

можно переписать условия так:

switch (true) {
   case (bodyWidth > 1600):
      fun1();
      break;
   case (bodyWidth > 1000):
      fun2();
      break;
   case (bodyWidth > 600):
      fun3();
      break;
   default:
      fun4();
      break;
}

Lion_astana · #4 (**permalink**) 26.12.2013, 15:37

Poznakomlus,
спасибо за совет, так и вправду красивее )

ksa, что-то я не понял эту конструкцию...

Я немного упрощу пример:

catCols();
$(window).resize(catCols);
		 
function catCols() {
$(".h_menu_block").css("display","block").eq(1).css("display","none"); //Например
}

Вот. Это на каждой странице сайта.
А например на странице "Контакты" мне нужно в функцию catCols добавить еще какой-нибудь код. КАК ЭТО СДЕЛАТЬ? Срабатывает несколько проверок, происходит подгрузка контента AJAX-ом, и не хочется еще кучу кода гондобить, просто иногда пару строчек дописать в уже существующую функцию...

ksa · #5 (**permalink**) 26.12.2013, 21:38

Сообщение от Lion_astana

что-то я не понял эту конструкцию...

Она проще простого... Если есть функция - запускай.

Lion_astana · #6 (**permalink**) 27.12.2013, 13:48

ksa,
Да, невнимательно как-то глянул вначале. Это все отлично, но проблема в том, что разные js файлы на странице не видят друг друга. Т.е. общий скрипт я подключаю в head страницы, там прописано ваше условие. Затем на странице, например, "Контакты" подключаю еще один скрипт, внутри которого конструкция, наличие которой проверяет первый скрипт. Но все это не работает, они не знают друг о друге, правильно?

Или я что-то не так проэксперементировал?

ksa · #7 (**permalink**) 27.12.2013, 13:55

Сообщение от Lion_astana

они не знают друг о друге, правильно?

Не совсем так...
Если страница вся загрузилась все скрипты знают дру про друга.
Любой "нижний" (грузится позже) "знает" про "верхний" (грузится ранее)...

ksa · #8 (**permalink**) 27.12.2013, 14:06

Иллюстрация...

one.js

if (window.two) {
	two();
} else {
	alert('Not function two()...');
};

function one() {
	alert(1);
};

two.js

if (window.one) {
	one();
};

function two() {
	alert(2);
};

three.js

if (window.one) {
	one();
};
if (window.two) {
	two();
};

Ну и ХТМЛ...

<!DOCTYPE html>
<html>
<head>
<script src="one.js"></script>
<script src="two.js"></script>
<script src="three.js"></script>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
</script>
</head>
<body>
</body>
</html>

Lion_astana · #9 (**permalink**) 27.12.2013, 16:03

ksa,
спасибо. Раньше так и думал как ты говоришь, но вчера попробовал и даже удивился. Просто "верхний" скрипт обернул в jQ:

$(function(){
 var getParam = function(){
	$("#my_div").css("background-color","#000");
	 };
			   
});

Потом в нижнем делаю проверку:

if (window.getParam !== undefined) {getParam()};

И ничего не происходило...

Сейчас в верхнем скрипте убрал конструкцию для выполнения скриптов после построения ДОМ-а, оставил так:

var getParam = function(){
	$("#my_div").css("background-color","#000");
	 };

Работает!
Спасибо тебе за помощь большое! С наступающим тебя!

ksa · #10 (**permalink**) 28.12.2013, 14:33

Сообщение от Lion_astana

С наступающим тебя!

И тебя...

Форум

Справочник

Discord чат

Курсы javascript