Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Почему не видна переменная? / 5 сообщений из 5, страница 1 из 1
10.06.2016, 00:34
    #39253954
maxapet
maxapet
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Почему не видна переменная?
Имеется такой фрагмент кода jQuery-плагина:
Код: 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.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
    $.fn.colorPicker = function(method){
		var settings;
		var methods = {
			setColor: function(color) {
				if (settings == undefined){
					alert("settings is undefined");
				} else if (settings == null){
					alert("settings is null");
				};
				if (color[0] != "#")
					color = "#" + color;
				this.find(".color-picker-tbl td").each(function(i) {
					if (settings.colors[i] == color) {
						$(this).trigger("click");
					}
				});
				alert();
			},
			init: function(options) {
				return this.each(function(){
					settings = $.extend({}, defaults, options);
					var lineCnt = 2;
					var cellsInLine = settings.colors.length / lineCnt;

					var tbl = $("<table class='color-picker-tbl'/>");
					for(l=0; l < lineCnt; l++){
						var tr = $("<tr />");
						tr.appendTo(tbl);
						for(c=0; c < cellsInLine; c++){
							var td = $("<td style='background-color: " + settings.colors[l * cellsInLine + c] + ";' class='color-picker-mask'></td>").appendTo(tr);
						}
					}
					$(this).append(tbl);
					var $cells = $(this).find(".color-picker-tbl td");
					$cells.each(function(i) {
						$(this).click(function() {
							if (i != settings.selectedColorIdx){
								$cells.eq(settings.selectedColorIdx).removeClass("selected").removeClass("selected-color-mask-1").removeClass("selected-color-mask-2");
								$(this).addClass("selected").addClass(isDark(settings.colors[i]) ? "selected-color-mask-1" : "selected-color-mask-2");
								settings.selectedColorIdx = i;
							}
							settings.click(settings.colors[i]);
						});
					});
					//$cells.eq(settings.selectedColorIdx).trigger("click");
				});
			}
		}
		// немного магии
		if ( methods[method] ) {
			// если запрашиваемый метод существует, мы его вызываем
			// все параметры, кроме имени метода придут в метод
			// this так же перекочует в метод
			return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
		} else if ( typeof method === 'object' || ! method ) {
			// если первым параметром идет объект, либо совсем пусто
			// выполняем метод init
			return methods.init.apply( this, arguments );
		} else {
			// если ничего не получилось
			$.error( 'Метод "' +  method + '" не найден в плагине jQuery.colorPicker' );
		}
   }



Во время работы сначала вызывается функция init, которая, казалось бы, должна инициализировать переменную settings, заданную во второй строке, но этого не происходит. При последующем вызове функции setColor выдаётся сообщение "settings is undefined". Почему? Ведь settings определена во внешней для init и setColor функции, значит, по правилам видимости Javascript, должна быть в них видима и доступна.
Если же задать какое-то начальное значение для settings, то при вызове init оно не меняется. Получается, что при вызове init в строке
Код: javascript
1.
settings = $.extend({}, defaults, options);

создаётся новая переменная settings, Но почему?! И как сделать так, чтобы работала именно переменная settings, объявленная во второй строке данного фрагмента?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
10.06.2016, 06:01
    #39253970
бухалтер фантоцци
бухалтер фантоцци
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Почему не видна переменная?
maxapet,

Так у Вас при каждом вызове заново создаются все внутренние переменные и функции.

Можно сделать немедленно выполняемую функцию / функцию-выражение : ( function(){... return obj; } )(),
которая будет создавать объект для доступа к внутренним контекстным переменным-объектам methods, init и т.д.
Например, тот код, который у Вас внизу (под комментарием "// немного магии"), сделать в виде возвращаемой функции - объявления.

$.fn.colorPicker = ( function(){... return function(method) {...}; } )();
а уже потом вызывать как $.fn.colorPicker(method);

Можно передавать параметры для инициализации ( function(){... return function(method) {...}; )(param1,param2,...),

как-то так это делается.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
10.06.2016, 07:07
    #39253978
maxapet
maxapet
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Почему не видна переменная?
бухалтер фантоцци, спасибо. Похоже, действительно, проблема в том, что когда я вызываю методы класса colorPicker, например, так
Код: javascript
1.
$("#colorPicker").colorPicker("setColor", "#FF00FF")


то в этот момент переменная settings, объявленная во второй строке, создаётся заново.
А вот дальнейшее я не понял. Объясните, пожалуйста, с примером.

P.S. Если я объявлю settings вне тела функции $.fn.colorPicker, то она становится единственной для всех экземпляров этого плагина, а мне нужно, чтобы у каждого экземпляра были собственные настройки.
А если её объявить, например, в методе init, то её не видит метод setColor, что вполне естественно.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
10.06.2016, 09:15
    #39254017
maxapet
maxapet
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Почему не видна переменная?
бухалтер фантоцци, спасибо ещё раз за совет. Решил проблему использованием метода data из jQuery, Индивидуальные настройки хранятся в нём.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
10.06.2016, 14:30
    #39254284
бухалтер фантоцци
бухалтер фантоцци
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Почему не видна переменная?
maxapetА вот дальнейшее я не понял. Объясните, пожалуйста, с примером.

Код: 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.
/* var myProp = */(function (wProp) {

  var a,b,c,d,e,f;
  var OBJ;

  /* ... тут куча кода, который работает с переменными a,b,c,d,e,f и wProp (или псевдо-массивом arguments ) */

  function f1 (a,b,c) { ... }
  function f2 (a,b,c) { ... }

  /* ... */

  OBJ = {
    setA : function(value) { if(typeof(value==='number')) a = value; return a; },
    getA : function() { return a; },
    /* ... */
    f01 : f1,
    f02 : f2
  }
  /* Если this указывает на window, то будет создана переменная window[wProp] */
  if (typeof(wProp) === 'string') this[wProp] = OBJ;

  /* Возвращаем наш объект */
  return OBJ;

})(/*'myProp'*/);


/* -------------------------------- Использование: ------------------------- */

var myProp = ( function (wProp) { ... } )();

/* или так */
( function (wProp) { ... } )('myProp');

/* или так */
var myProp = function wProp) { ... };
var myContext = null || window || window.parent || window.top; /* || window.frames[0].contentWindow || ... */
myProp.call( myContext , 'myProp');
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Почему не видна переменная? / 5 сообщений из 5, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]