Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.08.2013, 21:16
Аватар для Алек
Аспирант
Отправить личное сообщение для Алек Посмотреть профиль Найти все сообщения от Алек
 
Регистрация: 14.04.2013
Сообщений: 85

Связка switch-case и массива
Доброго всем времени суток!
Ломаю голову над таким вопросом:
Вот html код:
<div id="galeryMoto">
					<img src="images/gal/1.jpg" />
				</div>
				<input type="submit" id="prev" value="Назад" />
				<input type="submit" id="next" value="Вперёд" />

Вот JQuery:
$('#next').click(function(){
		switch ($('#galeryMoto img').attr('src')){
			case 'images/gal/1.jpg':
			nova ( 'images/gal/2.jpg', 'url(images/gal/2.jpg)', 'explode');		
			break;	
			case 'images/gal/2.jpg':
			nova ('images/gal/3.jpg', 'url(images/gal/3.jpg)', 'drop');		
			break;
			case 'images/gal/3.jpg':
			nova ( 'images/gal/4.jpg', 'url(images/gal/4.jpg)', 'explode');		
			break;	
			case 'images/gal/4.jpg':
			nova ('images/gal/1.jpg', 'url(images/gal/1.jpg)', 'drop');		
			break;			
		}			
	})
	
	function nova (images, background, effect) {
		$('#galeryMoto').css({'background-image':background});
		$('#galeryMoto img').hide(effect, 1000).attr('src', images).show(1);				
	}

Всё хорошо работает, но что если я захочу расширить галерею до 20 изображений? Тогда придётся добавлять кучу операторов case!
Я вот что думаю:
Сделать три массива, в первом будут атрибуты src для картинок,
во втором бэкграунды,
в третьем эффекты.
После создать функцию в кейсе, которая будет получать данные из массива, сравнивать с текущим значением атрибута src и в качестве параметра передавать в функцию nova следующий элемент массива.
Что-то вроде того:
var ArrayForImg = [/*Элементы массива*/];
	var CountArrayForImg = for (var i = 0, i < ArrayForImg.length, i++){
		return (ArrayForImg[i]);
	}


Но мне абсолютно не ясно как полученный в цикле результат запихать в кейс!
Как же тогда сравнивать со всеми элементами массива?
Есть какие-нибудь идеи?
Заранее большое всем спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 04.08.2013, 22:18
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Алек, 3 месяца на форуме, тестовых примеров с возможностью запуска делать не научился?

Сообщение от Алек
var CountArrayForImg = for (var i = 0, i < ArrayForImg.length, i++){
и вот это чё такое?
Ответить с цитированием
  #3 (permalink)  
Старый 04.08.2013, 22:49
Аватар для Алек
Аспирант
Отправить личное сообщение для Алек Посмотреть профиль Найти все сообщения от Алек
 
Регистрация: 14.04.2013
Сообщений: 85

Сообщение от bes Посмотреть сообщение
Алек, 3 месяца на форуме, тестовых примеров с возможностью запуска делать не научился?
Неа, , а хотелось бы...
Можно ссылочку дать где про это говориться?

Сообщение от bes Посмотреть сообщение
и вот это чё такое?
var CountArrayForImg = for (var i = 0, i < ArrayForImg.length, i++)

Да чё-то у меня дико ни чё не получается, , я делаю всё по шагам, и вот такая проблема:
Вот так работает, выводится хорошо, вполне можно передавать в параметр функции, только кавычки приплюсовать:
var ArrayForImg = ['images/gal/2.jpg', 'url(images/gal/2.jpg)', 'explode'];
	for (var i = 0; i < ArrayForImg.length; i++){
		document.write (ArrayForImg[i] + "<br />");
	}

А вот так выводится только последний элемент, не могу понять в чём дело:
var ArrayForImg = ['images/gal/2.jpg', 'url(images/gal/2.jpg)', 'explode'];
	for (var i = 0; i < ArrayForImg.length; i++){
		var ImgText = ArrayForImg[i];
	}

$('#forresults').text(ImgText);

На мой взгляд всё вроде логично...

Последний раз редактировалось Алек, 04.08.2013 в 23:00.
Ответить с цитированием
  #4 (permalink)  
Старый 04.08.2013, 22:57
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Сообщение от Алек
Можно ссылочку дать где про это говориться?
http://javascript.ru/formatting
собираешь весь код в один тестовый пример и заключаешь его в [html run] и усё

вот тебе один из простых вариантов next
var mas = ["image1", "image2", "image3"];
function next(eq) {
	var eq = mas.indexOf(eq);
	if (eq == -1) 
		return mas[0];
	if (mas[eq + 1] == undefined) 
		return mas[eq];
	return mas[eq + 1];
}
alert(next("image1"));
alert(next("image3"));
alert(next("image4"));

indexOf для массивов не для IE<9, можно сделать функцию-эмулятор, где в цикле идёт перебор со сравнением

Последний раз редактировалось bes, 04.08.2013 в 23:00.
Ответить с цитированием
  #5 (permalink)  
Старый 05.08.2013, 00:33
Аватар для Алек
Аспирант
Отправить личное сообщение для Алек Посмотреть профиль Найти все сообщения от Алек
 
Регистрация: 14.04.2013
Сообщений: 85

bes, спасибо!
indexOf прекрасный метод, весь код свёлся к 4 строчкам, а функционал увеличился!
Вот как это теперь выглядит:
var array = ['images/gal/1.jpg', 'images/gal/2.jpg', 'images/gal/3.jpg', 'images/gal/4.jpg',];

$('#next1').click(function(){
var itog = array.indexOf($('#galeryMoto1 img').attr('src'));
$('#galeryMoto1 img').attr('src', (array[itog + 1]));
});

Теперь, если я захочу добавить в галерею сколько угодно изображений, мне достаточно просто использовать метод
array.push('images/gal/5.jpg');

Осталось только по этой схеме доработать эфекты.
Ещё раз спасибо!
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
switch не корректно работает rowlin jQuery 9 21.07.2013 00:37
С какой стороны взяться? bayrach jQuery 3 06.03.2011 13:31
Расшифровка кода, генерируемого flash. ГостьФорума Общие вопросы Javascript 6 02.02.2011 01:26
Помогите разобраться с календарем FoMurJIom Общие вопросы Javascript 1 21.06.2010 16:56
Не работает скрипт Ling Firefox/Mozilla 2 03.05.2009 16:03