Ответы пользователя по тегу jQuery
  • Почему валидация сработала не так как задумывалась?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Это не совсем ответ на ваш вопрос, просто упрощенная демонстрация подхода
    https://jsfiddle.net/t973546n/2/

    Если надо глубже и больше гуглите "jsonschema validate"
    Ответ написан
  • Не работает реализация алгоритма, поможете найти ошибку?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    замените:
    // Скроллим еще ниже
      if(scrollBottom == true){
        //alert("Скроллим вниз");
        objDiv.scrollTop = objDiv.scrollHeight;
      }


    на

    // Скроллим еще ниже
      if(scrollBottom == true){
        //alert("Скроллим вниз");
        setTimeout(()=>{
           objDiv.scrollTop = objDiv.scrollHeight;
        },1000);
      }


    Но это будет ненадежный костыль, по хорошему тут надо все переделать, включая и php/view.php

    Не работало как надо потому, что без сеттаймоута вы сразу после замены сообщений в блоке мессаджес пытаетесь проскролить, но браузер в этот момент еще не отработал вставку (тоесть новые сообщения еще не заменили старые и не изменили высоту прокрутки)

    соответственно с сеттаймоутом вы даете время браузеру отработать вставку сообщений, и на момент когда вы делаете objDiv.scrollTop = objDiv.scrollHeight; в блоке уже новые сообщения.

    с алертом работало по той же причине, алерт не асинхронный, и потому пока висел алерт, код дальше не выполнялся, а начинал выполнятся после закрытия алерта. Таким образом, пока вы тянулись мышкой закрывать алерт, давали браузеру время вставить и отобразить новый блок сообщений.

    Вся эта система по сути сейчас работает на багах, я бы советовал задать еще один вопрос о том как правильно сделать данный функционал (как оптимизировать объем передаваемых сообщений и обновление блока с сообщениями)
    Ответ написан
  • Эта регулярка не запрещает ввод других символов, а как запретить?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    olya_097, еще раз здравствуйте. Ваш вопрос слегка не полон, поэтому попробую догадаться в чем дело.
    эта регулярка не запрещает ввод других символов

    Догадка: видимо Вы используете какую то библиотеку/плагин в котором можно задавать с помощью регулярки фильтр вводимых данных для полей вода типа input и textarea.
    Если это так, то хотелось бы узнать что это за библиотека/плагин и тогда возможно понять в чем причина.
    Если же Вы пользуетесь обычным input и/или textarea и при этом не используете никаких библиотек/плагинов, расширяющих их функционал, то скорее всего вы имеете небольшой самописный кусок js кода, который через регулярку проверяет введенный текст (или вводимый текст) и что то там дальше делает. Если это так, то хотелось бы увидеть этот кусок кода вместе с частью разметки, включающей в себя контролируемые кодом поля ввода и тогда, я уверен, мы сможем Вам помочь разобраться с решением Вашего вопроса.
    Ответ написан
  • Как на странице сайта загрузить .wrl для просмотра?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    да, это возможно, большинство современных webgl библиотек, таких как three.js и babilon.js имеют лоадеры для vrml
    вот демка сделаная на three.js
    а вот пример кода как это сделать
    Ответ написан
  • Как оставлять check box включенным, после перезагрузки страницы?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Еще можно хранить состояние чекбоксов в локалсторадже.
    Ответ написан
  • Как запретить создавать объекты, после создания одного?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Не задумываясь глубоко над тем как это можно было бы реализовать правильно и красиво (просто добавил флаг isMapAdded:)
    var isMapAdded = false;
    
    $(window).scroll(function () {
      var el = $('.map');
      if ($(this).scrollTop() > el.offset().top - 800) {
        if(isMapAdded) return;
        isMapAdded = true;
        var script = document.createElement('script');
        script.src = "https://api-maps.yandex.ru/services/constructor/1....";
        el.append(script);
      };
    });
    Ответ написан
  • Как получить responseText от метода complete в jQuery?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    $.ajax({
      url: $(form).attr("action") + '?redirect_disallow=1',
      data: $(form).find('input').val(),
      success : function(responseText){
         console.log(responseText);
      }
    });
    Ответ написан
  • Как разобрать массив JSON без запятых?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Исправил)))

    Можно так:


    Или так:


    PS: должен отметить, что используемые регулярные выражения имеют ряд ограничений. Например если в данных будут вложенные массивы с объектами с пробелом перед закрывающей скобкой [{...}, {...}, ... ] то втарой вариант будет работать неверно. Если в данных будут строки с примерно таким содержимым "} {" или "}{" то оба варианта перестанут работать
    Ответ написан
  • Как создать страницы, которые будут использовать данные из своей ссылки?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Для этих целей и существуют веб сервера с серверными скриптами и базами данных. Вместе они составляют так называемый backend. Суть бэкенда заключается в обработке запросов от клиента и формировании в ответ на эти запросы страниц либо данных, которые отдаются клиенту для дальнейшей обработки и/или отображения. В качестве сервера для бэкэнда может служить apache, nginx, express.js и др.. В качестве языка программирования для серверных скриптов может служить почти любой ЯП, но наиболее популярны PHP, python, node.js, Ruby и некоторые другие ЯП. Также существует множество бэкенд фрэймворков, написанных на различных языках. Целью этих фрэймворков служит разной степени упрощение/шаблонизация/автоматизация написания серверных скриптов.
    Привожу небольшой пример, отвечающий на ваш вопрос и иллюстрирующий данный подход. Пример написан на nodejs и использует бэкенд фрэймворк express.js

    var express = require('express');
    var app = express();
    
    app.get('/user/:user', function(req, res) {
      var user = req.params.user;
      // Тут дожны быть проверки
      // прав клиента на просмотр
      // запрашиваемых данных.
      // запросы в бд за данными пользователя,
      // и другими необходимыми данными.
      // затем для пользователя 
      // указанного в запросе формируются
      // данные для отдачи клиенту
      // это могут быть как именно данные,
      // например в формате json так и страница
      // (частично и полностью)
    
      // затем эти данные отдаются клиенту:
      res.send(data);
    });
    Ответ написан
  • Как ускорить (скликать) таймер обратного отсчета на сайте?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Вариант скликивания секунд:
    var _Seconds = $('.timer').text(),
    var _Clicks = 0; // счетчик кликов
    int;
    int = setInterval(function() { // запускаем интервал
    if (_Seconds - _Clicks > 1) {
    _Seconds--; // вычитаем 1
    $('.timer').text(_Seconds - _Clicks); // выводим получившееся значение в блок
    } else {
    clearInterval(int); // очищаем интервал, чтобы он не продолжал работу при _Seconds = 0
         $('.div_x').addClass('xxx'); //добавляем класс на элемент 1
         $('.div_y').addClass('yyy'); //добавляем класс на элемент 2
      }
    }, 1000);


    Тут необходимо понимать, что:
    1. Обработка происходит раз в секунду, а в ситуации когда до конца осталось пара секунд можно успеть кликнуть по кнопке несколько десятков раз, но это не остановит счетчик.Пользователь все равно будет ждать ближайшего срабатывания setInterval.
    2. Для более тонкой обработки алгоритм надр менять. Доберусь до компа, накидаю код.

    PS: вот обещанное решение, в нем многое можно изменить и доработать, но оно прекрасно демонстрирует подход, который я хотел Вам показать:

    Ответ написан
  • Как правильно написать такой простой скрипт?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    const list = ["Lacquered", "Acrylic", "Veneer", "Laminate", "Thermofused"];
    const row = 13;
    const rowStr = ".from-row:eq(" + row + ")";
    $(rowStr + " .select-change-item option.Lacquered").show();
        $(rowStr + " .select-change-item option:not(.Lacquered)").hide();
        $(rowStr + " .select-change").change(function() {
            list.forEach(item=>{
                if ($(rowStr + " .select-change").val() == item) {
                    $(rowStr + " .select-change-item option."+item).show();
                    $(rowStr + " .select-change-item option:not(."+item+")").hide();
                }
            });
        });
    Ответ написан
  • Как добавить на страницу js файл чтобы работал корректно?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    я у себя для подобных целей использую самописный велосипед:

    код модуля (тут можно посмотреть как реализована загрузка других модулей)
    (function(exports) {
    	console.log("Require", exports);
    
    	"use strict";
    
    	// создаем адресное пространство модуля
    	exports.require = load.bind(this);
    
    	/* функция загружает набор произвольных скриптов
    		 options может содержать:
    		 baseurl - адресс сервера на котором находятся скрипты
    							 вида "http://server/"
    							 если не задано берется из window.location
    		 path		- путь к папке со скриптами
    							 вида "your/path/to/scriptd/"
    							 если не задано берется ""
    		 modules - массив с названиями загружаемых скриптов
    							 вида ["script1","script2",...,"scriptN"]
    		 onready - callback функция, вызываемая по завершении загрузки
    							 всех модулей указанных в modules
    	*/
    	function load( options ) {
    		// выход если не указан ни один скрипт для загрузки
    		if( !options.modules )
    			return;
    
    		// если скрипт для загрузки указан в виде строки - переделываем в массив
    		if( typeof options.modules === 'string' )
    			options.modules = [options.modules];
    
    		// выход если скрипты для загрузки не массив
    		if( typeof options.modules != 'object' )
    			return;
    
    		// если не указан URL сервера - берем его из window.location
    		if( !options.baseurl || typeof options.baseurl != 'string')
    			options.baseurl = window.location;
    
    		// если не указан путь к скриптам - берем ""
    		if( !options.path || typeof options.path != 'string')
    			options.path = '';
    
    		// если не указана callback функция - создаем заглушку
    		if( !options.onready || typeof options.onready != 'function')
    			options.onready = function(){};
    
    		// создадим промис, который всегда выполнится
    		var sequence = Promise.resolve();
    
    		// Пройдемся по всем загружаемым модулям (скриптам)
    		for ( let name of options.modules ) {
    			const url =
    					options.baseurl
    				+ options.path
    				+ name;
    
    			// Добавляем действия с ними в конец последовательности
    			sequence = sequence.then( function() {
    				return loadScript( url );
    			} );
    			// .then(function(chapter) {
    			//	 addHtmlToPage(chapter.html);
    			// });
    		}
    
    		sequence.then( function() {
    			// все загрузились
    			options.onready();
    		} );
    
    	}
    
    	/* функция загружает произвольный скрипт по URL и выдает promise */
    	function loadScript( url ) {
    		let promise = new Promise( function( resolve, reject ) {
    			// Adding the script tag to the head as suggested before
    			let head = document.getElementsByTagName( 'head' )[ 0 ];
    			let script = document.createElement( 'script' );
    			script.type = 'text/javascript';
    			script.src = url;
    
    			// Then bind the event to the callback function.
    			// There are several events for cross browser compatibility.
    			script.onreadystatechange = cb;
    			script.onload = cb;
    
    			function cb() {
    				resolve();
    			}
    
    			// Fire the loading
    			head.appendChild( script );
    
    		} );
    		return promise;
    	}
    
    	// создаем ссылки на функции модуля в адресном пространстве модуля
    
    })(this.libs=this.libs||{});

    подключение модуля
    <!DOCTYPE html>
    <html>
    <head>
        <title>graph eginere</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <script src="js/require.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        ...
    </body>
    </html>

    как с помощью данного модуля загружать другие модули
    window.libs.require({
    		path: "js/",
    		modules: [
    			"polyfill.setimmediate.js",
    			"vector.js",
    			"events.js",
    		],
    		onready:()=>{
    			console.log("LOAD OK");
    		}
    	});

    пример модуля polyfill.setimmediate.js
    /**
     * Полифил для setImmediate 
     * (единственное что в неизмененном виде было взято гдето в Интернете)
     */
    if (!window.setImmediate) window.setImmediate = (function() {
    	var head = { }, tail = head; // очередь вызовов, 1-связный список
    
    	var ID = Math.random(); // уникальный идентификатор
    
    	function onmessage(e) {
    		if(e.data != ID) return; // не наше сообщение
    		head = head.next;
    		var func = head.func;
    		delete head.func;
    		func();
    	}
    
    	if(window.addEventListener) { // IE9+, другие браузеры
    		window.addEventListener('message', onmessage);
    	} else { // IE8
    		window.attachEvent( 'onmessage', onmessage );
    	}
    
    	return function(func) {
    		tail = tail.next = { func: func };
    		window.postMessage(ID, "*");
    	};
    }());

    пример модуля events.js
    (function(exports) {
    	console.log("Flow.Events");
    
    	"use strict";
    
    	/**
    	 * класс емиттера событий(почти eventemitter)
    	 * содержит функции on, once и emit
    	 */
    	exports.Events = Events;
    	function Events(){
    		// конструктор
    		//console.log("Events.constructor");
    		this.e = { };
    	};
    
    	/**
    	 * Установить слушатель для события @name
    	 * @param  {String}   name    стороковый идентификатор события
    	 * @param  {Function} cb      функция-слушатель. Вызывается при возникновении события @name
    	 * @param  {Number}   timeout функция-слушатель может быть вызвана 3-я разными способами 
    	 *                            1. незамедлительно при возникновении события (timeout не задан)
    	 *                            2. асинхронно, с незначительной отсрочкой (timeout равен 0)
    	 *                            3. асинхронно, через установленный интервал времени (timeout больше 0)
    	 * @param  {Boolean}  isOnce  если true, то слушатель будет вызван 1 раз, после чего будет удален
    	 * @return {Function}         функция, вызов которой удалит слушателя.
    	 */
    	Events.prototype.on = function(name, cb, timeout, isOnce) {
    		if (typeof cb !== 'function')
    			throw new Error('listener is not a function');
    		const e = this.e[name] = this.e[name]||[];
    		const d = this.mode(timeout);
    		if(isOnce) d.isOnce = true;
    		d.cb = cb;
    		e.push(d);
    		return function () {
    			const i = e.indexOf(d);
    			if(i!==-1) e.splice(i, 1);
    		}
    	};
    
    
    	/**
    	 * вычислить режим вызова обработчиков события
    	 * @param  {Number}   timeout функция-слушатель может быть вызвана 3-я разными способами 
    	 *                            1. незамедлительно при возникновении события (timeout не задан)
    	 *                            2. асинхронно, с незначительной отсрочкой (timeout равен 0)
    	 *                            3. асинхронно, через установленный интервал времени (timeout больше 0)
    	 * @return {Function}         Объект, может содержать поля поля timeout и isTimeout или isAsync или isSync
    	 */
    	Events.prototype.mode = function(timeout) {
    		const d = {};
    		if(typeof timeout === "number"){
    			if(timeout>0){
    				d.timeout = Math.ceil(timeout);	
    				d.isTimeout = true;
    			} 
    			else d.isAsync = true;
    		}
    		else d.isSync = true;
    		return d;
    	};
    
    	/**
    	 * установить глобальный режим вызова обработчиков события
    	 * @param  {Number}   timeout функция-слушатель может быть вызвана 3-я разными способами 
    	 *                            1. незамедлительно при возникновении события (timeout не задан)
    	 *                            2. асинхронно, с незначительной отсрочкой (timeout равен 0)
    	 *                            3. асинхронно, через установленный интервал времени (timeout больше 0)
    	 */
    	Events.prototype.setmode = function(timeout) {
    		 this.m = this.mode(timeout);
    	};
    
    	/**
    	 * отменить глобальный режим вызова обработчиков события
    	 */
    	Events.prototype.clearmode = function() {
    		 this.m = undefined;
    	};
    
    
    	/**
    	 * Установить одноразовый слушатель для события @name
    	 * @param  {String}   name    стороковый идентификатор события
    	 * @param  {Function} cb      функция-слушатель. Вызывается при возникновении события @name
    	 * @param  {Number}   timeout функция-слушатель может быть вызвана 3-я разными способами 
    	 *                            1. незамедлительно при возникновении события (timeout не задан)
    	 *                            2. асинхронно, с незначительной отсрочкой (timeout равен 0)
    	 *                            3. асинхронно, через установленный интервал времени (timeout больше 0)
    	 */
    	Events.prototype.once = function(name, cb, timeout) {
    		const off = this.on(name, function(){
    			off();
    			cb.apply(this,arguments);
    		}, timeout,true);
    	};
    
    	/**
    	 * Вызвать всех слушателей для события @name
    	 * @param  {String}   name    стороковый идентификатор события
    	 */
    	Events.prototype.emit = function(name) {
    		const e = this.e[name];
    		if(!e || !e.length) return;
    		const args = [].slice.call(arguments,1);
    		e.some( function(l) {
    			if(l.isEmitted) return;
    			if(l.isOnce) l.isEmitted = true;
    			const mode = this.m||l;
    			if(mode.isTimeout) {
    				setTimeout(function() { l.cb.apply(this, args); }, mode.timeout);
    			} else if(mode.isAsync) {
    				window.setImmediate(function() { l.cb.apply(this, args); });
    			} else {
    				l.cb.apply(this, args);
    			}
    			const event = args[0];
    			if(event.__stopImmediatePropagation) return true;
    			return false;
    		});
    	};
    })(this.libs=this.libs||{});

    Ответ написан
  • Как сделать чтобы DOM элементы искало только по названию?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Вариант без регулярных выражений:

    Ответ написан