Daily Archives: 15.12.2015

JS. Как использовать функцию внутри функции в качестве параметра.

Posted on 15.12.2015 by Stanislav_Panteleev

Файл Main.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		<title>main</title>

	</head>

	<body>

<button id="CheckPassengers">CheckPassengers</button>


<script src="EventHandler.js"></script>
<hr>
<div id="mydiv"> </div>
	</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<head>

</head>

<body>

<button id="CheckPassengers">CheckPassengers</button>

<hr>

</body>

</html>

Примечание. Когда мы используем функцию внутри другой функции в качестве параметра, то должны писать её без круглых скобок, хотя её фактическая реализация со скобками. То есть, например вот так

Somefunction(Anotherfunction); //<<Так сработает

1	Somefunction(Anotherfunction); //<<Так сработает

а не так

Somefunction(Anotherfunction(parameter1,parameter2));// <<Так не сработает

1	Somefunction(Anotherfunction(parameter1,parameter2));// <<Так не сработает

Файл EventHandler.js

/**
 * @author Stas
 */
// Создадим массив объектов
var passengers = [  { name: "Jane Doloop", paid: true, ticket: "coach" },
					{ name: "Dr. Evel", paid: true, ticket: "firstclass" },
					{ name: "Sue Property", paid: true, ticket: "firstclass" },
					{ name: "John Funcall", paid: true, ticket: "premium" } ];

//В эту функцию будем подставлять другие, вместо параметра test					
function processPassengers(passengers, test) {
	for (var i = 0; i < passengers.length; i++) {
		if (test(passengers[i])) {
			return false;
		}
	}
	return true;
}

//Доп. функция. Проверим есть ли местер зло в списке?
function checkNoFlyList(passenger) {
	if (passenger.name === "Dr. Evel") return true;
}

//Доп. функция. Проверим все ли оплатили?
function checkNotPaid(passenger) {
	if (passenger.paid==false) return true;
}


function Integration(){
	//Проверка на доктора зло
	if (processPassengers(passengers,checkNoFlyList)){
		document.getElementById('mydiv').innerHTML='На борту нет доктора зло';
		
	} else {document.getElementById('mydiv').innerHTML='На борту есть доктор зло';}
	
	//Проверка на оплату
	if (processPassengers(passengers,checkNotPaid)){
		document.getElementById('mydiv').innerHTML=document.getElementById('mydiv').innerHTML+'<br>'+'Все оплатили';
	} else
	{document.getElementById('mydiv').innerHTML=document.getElementById('mydiv').innerHTML+'<br>'+'Кто-то не оплатил';}
	
	
};
					
document.getElementById('CheckPassengers').onclick=function(){Integration();};

/**

* @author Stas

// Создадим массив объектов

var passengers = [ { name: "Jane Doloop", paid: true, ticket: "coach" },

{ name: "Dr. Evel", paid: true, ticket: "firstclass" },

{ name: "Sue Property", paid: true, ticket: "firstclass" },

{ name: "John Funcall", paid: true, ticket: "premium" } ];

//В эту функцию будем подставлять другие, вместо параметра test

function processPassengers(passengers, test) {

for (var i = 0; i < passengers.length; i++) {

if (test(passengers[i])) {

return false;

}

return true;

}

//Доп. функция. Проверим есть ли местер зло в списке?

function checkNoFlyList(passenger) {

if (passenger.name === "Dr. Evel") return true;

}

//Доп. функция. Проверим все ли оплатили?

function checkNotPaid(passenger) {

if (passenger.paid==false) return true;

}

function Integration(){

//Проверка на доктора зло

if (processPassengers(passengers,checkNoFlyList)){

document.getElementById('mydiv').innerHTML='На борту нет доктора зло';

} else {document.getElementById('mydiv').innerHTML='На борту есть доктор зло';}

//Проверка на оплату

if (processPassengers(passengers,checkNotPaid)){

document.getElementById('mydiv').innerHTML=document.getElementById('mydiv').innerHTML+'<br>'+'Все оплатили';

} else

{document.getElementById('mydiv').innerHTML=document.getElementById('mydiv').innerHTML+'<br>'+'Кто-то не оплатил';}

};

document.getElementById('CheckPassengers').onclick=function(){Integration();};

… Continue reading →

Posted in javascript | Comments Off

JS. Как использовать функцию внутри функции?

Posted on 15.12.2015 by Stanislav_Panteleev

Файл Main.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		<title>main</title>

	</head>

	<body>

<button id="mybutoon">mybutoon</button>


<script src="EventHandler.js"></script>
<hr>
<div id="mydiv"> </div>
	</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<head>

</head>

<body>

<button id="mybutoon">mybutoon</button>

<hr>

</body>

</html>

Файл EventHandler.js

/**
 * @author Panteleev Stanislav
 */


function SaySomething(anyfunctionname) {
	var phrase=anyfunctionname('Aloha');
	alert (phrase);
}

function MyTranslator(word){
	if (word==='Hello') return 'Hello';
	if (word='Aloha') return 'Hello'; 
}

function Integration(){
	SaySomething(MyTranslator);//<<Здесь функция внутри функции
}

document.getElementById('mybutoon').onclick=function(){Integration();};

/**

* @author Panteleev Stanislav

function SaySomething(anyfunctionname) {

var phrase=anyfunctionname('Aloha');

alert (phrase);

}

function MyTranslator(word){

if (word==='Hello') return 'Hello';

if (word='Aloha') return 'Hello';

}

function Integration(){

SaySomething(MyTranslator);//<<Здесь функция внутри функции

}

document.getElementById('mybutoon').onclick=function(){Integration();};

Posted in javascript | Comments Off

JS. setTimeout. setInterval Вызов функций с задержкой и интервалом

Posted on 15.12.2015 by Stanislav_Panteleev

Демонстрация методов setTimeout и setInterval Main.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		<title>main</title>

	</head>

	<body>

<button id="SetInterval">SetInterval</button>
<button id="SetTimeout">SetTimeout</button>

<script src="EventHandler.js"></script>
<hr>
<div id="mydiv"> </div>
	</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<head>

</head>

<body>

<button id="SetInterval">SetInterval</button>

<button id="SetTimeout">SetTimeout</button>

<hr>

</body>

</html>

EventHandler.js

/**
 * @author Stas
 */

var time; var ON;

function CountDown(){
    if (ON==true){ 
	document.getElementById('mydiv').innerHTML=time+' seconds left';
	if (time!==0){time=time-1;} else
	if (time===0)
	{document.getElementById('mydiv').innerHTML='time is over'; ON=false;}
}
};


function setIntervalDemo(){

time=prompt('What is delay in seconds?','2'); 
ON=true;
setInterval(CountDown,1000);

}



function WriteToDiv(){
document.getElementById('mydiv').innerHTML=
document.getElementById('mydiv').innerHTML+' Its Ready now! Its setTimeoutDemo';
}




function setTimeoutDemo(){

document.getElementById('mydiv').innerHTML='';
time=prompt('What is delay in seconds?','2'); 
document.getElementById('mydiv').innerHTML='Wait... for '+time+' seconds...';
setTimeout(WriteToDiv,time*1000);
//location.reload();
	
}


document.getElementById('SetInterval').onclick=function(){setIntervalDemo();};
document.getElementById('SetTimeout').onclick=function(){setTimeoutDemo();};

/**

* @author Stas

var time; var ON;

function CountDown(){

if (ON==true){

document.getElementById('mydiv').innerHTML=time+' seconds left';

if (time!==0){time=time-1;} else

if (time===0)

{document.getElementById('mydiv').innerHTML='time is over'; ON=false;}

}

};

function setIntervalDemo(){

time=prompt('What is delay in seconds?','2');

ON=true;

setInterval(CountDown,1000);

}

function WriteToDiv(){

document.getElementById('mydiv').innerHTML=

document.getElementById('mydiv').innerHTML+' Its Ready now! Its setTimeoutDemo';

}

function setTimeoutDemo(){

document.getElementById('mydiv').innerHTML='';

time=prompt('What is delay in seconds?','2');

document.getElementById('mydiv').innerHTML='Wait... for '+time+' seconds...';

setTimeout(WriteToDiv,time*1000);

//location.reload();

}

document.getElementById('SetInterval').onclick=function(){setIntervalDemo();};

document.getElementById('SetTimeout').onclick=function(){setTimeoutDemo();};

Posted in javascript, Без рубрики | Comments Off

JS. Обработка некоторых событий. Простой пример

Posted on 15.12.2015 by Stanislav_Panteleev

Файл Main.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		<title>main</title>

	</head>

	<body>

<button id="ClickEvent">ClickEvent</button>
<button id="MouseMove">MouseMove</button>
<script src="EventHandler.js"></script>
<hr>
<div id="mydiv"> </div>
	</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<head>

</head>

<body>

<button id="ClickEvent">ClickEvent</button>

<button id="MouseMove">MouseMove</button>

<hr>

</body>

</html>

Файл EventHandler.js

/**
 * @author Stas
 */

var SwitchOn=true;

//Функция для обработки события onclick
function MyClick(){
 if (SwitchOn==true){
 	SwitchOn=false; 	
	document.getElementById('mydiv').innerHTML='This is Text after you clicked';
	}
	else
	{   SwitchOn=true;
		document.getElementById('mydiv').innerHTML='Another Text after your clicked';}
}

//Функция для обработки события onmousemove
function MyMouseMove(){
	 	
	document.getElementById('mydiv').innerHTML='This is mouse move Text';

}

//Функция для обработки события window.onload - сразу после загрузки
//Довольно популярный обработчик и часто называется именно init...
function init(){
	document.getElementById('mydiv').innerHTML='init function on load window has worked correctly';
	
}


//Назначаем обработчики через присваивание
document.getElementById('ClickEvent').onclick=MyClick;
document.getElementById('MouseMove').onmousemove=MyMouseMove;
window.onload=init;

/**
// ДРУГОЙ ВАРИАНТ. Назначаем обработчики через анонимные функции
document.getElementById('ClickEvent').onclick=function(){MyClick();};

document.getElementById('MouseMove').onmousemove=function(){MyMouseMove();};

window.onload=function(){init();};
*/

/**

* @author Stas

var SwitchOn=true;

//Функция для обработки события onclick

function MyClick(){

if (SwitchOn==true){

SwitchOn=false;

document.getElementById('mydiv').innerHTML='This is Text after you clicked';

}

else

{ SwitchOn=true;

document.getElementById('mydiv').innerHTML='Another Text after your clicked';}

}

//Функция для обработки события onmousemove

function MyMouseMove(){

document.getElementById('mydiv').innerHTML='This is mouse move Text';

}

//Функция для обработки события window.onload - сразу после загрузки

//Довольно популярный обработчик и часто называется именно init...

function init(){

document.getElementById('mydiv').innerHTML='init function on load window has worked correctly';

}

//Назначаем обработчики через присваивание

document.getElementById('ClickEvent').onclick=MyClick;

document.getElementById('MouseMove').onmousemove=MyMouseMove;

window.onload=init;

/**

// ДРУГОЙ ВАРИАНТ. Назначаем обработчики через анонимные функции

document.getElementById('ClickEvent').onclick=function(){MyClick();};

document.getElementById('MouseMove').onmousemove=function(){MyMouseMove();};

window.onload=function(){init();};

Как узнать какие обработчики у элементов? Я пользуюсь на данный момент Aptana Studio 3 – довольно хорошая IDE. Приведу пример, как можно посмотреть какие обработчики есть у элементов? Например, нам нужен обработчик для … Continue reading →

Posted in javascript | Comments Off

Daily Archives: 15.12.2015

JS. Как использовать функцию внутри функции в качестве параметра.

JS. Как использовать функцию внутри функции?

JS. setTimeout. setInterval Вызов функций с задержкой и интервалом

JS. Обработка некоторых событий. Простой пример

MY PROJECTS

Recent Posts

Categories