Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.71/7: Рейтинг темы: голосов - 7, средняя оценка - 4.71
0 / 0 / 0
Регистрация: 16.01.2016
Сообщений: 11

Много, много объектов

17.01.2016, 15:05. Показов 1433. Ответов 3
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Всем привет! Есть одно задание, но я понятия не имею как его реализовать. Суть такова, что нужно получить множество (100000+)одинаковых объектов (квадраты, круги и т.п.), с которыми можно взаимодействовать. К примеру, после клика всплывает какое-нибудь модальное окошко, с некоторыми параметрами, которые можно изменить. Прошу натолкнуть на мысль, или же прямо послать куда надо
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
17.01.2016, 15:05
Ответы с готовыми решениями:

Ошибка - много рекурсий
Все что должны делать эти две функции - это просто переводить латинские цифры в римские. Но почему то выдается ошибка "слишком много...

Select много одинаковых
http://jsfiddle.net/mpaullct/QyLWW/ нужно размножить (чтобы было три таких селектора) и работали само собой независимо друг от дружки ...

Много картинок на сайт
Здравствуйте. У меня есть к примеру 100 картинок в папке, от 1.jpg до 100.jpg, я хочу их все поставить на пустую страницу сайта, чтобы к...

3
123 / 62 / 32
Регистрация: 10.01.2014
Сообщений: 241
17.01.2016, 17:22
Лучший ответ Сообщение было отмечено Jective как решение

Решение

Jective,
вариант так себе, но работает
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
function Circle (width, height) {
    this._width = width;
    this._height = height;
    this._htmlItem = false;
}
Circle.prototype.constructor = new Circle();
 
Circle.prototype.createOne = function(whereAppend){
    this._htmlItem = document.createElement("div");
    this._htmlItem.style.width = this._width + "px";
    this._htmlItem.style.height = this._height + "px";
    this._htmlItem.style.borderRadius = "50px";
    this._htmlItem.style.backgroundColor = "red";
    this._htmlItem.classList.add("circle");
 
    this.appendToHtml(whereAppend);
}
Circle.prototype.appendToHtml = function (selector) {
    var whereAppend = document.querySelector(selector);
    whereAppend.appendChild(this._htmlItem);
}
Circle.prototype.addEvent = function (evName, fn) {
    this._htmlItem.addEventListener(evName, fn);
}
 
for (var i = 0; i < 1000; i++) {
    var circ = new Circle(100, 100);
    circ.createOne(".elems");
    circ.addEvent("click", function () {
        alert("clicked");
    })
}
ща может джедаи подтянутся и получше код дадут
https://fiddle.jshell.net/L2g6x1h1/

Добавлено через 1 час 14 минут
v 0.0.1 поочередно создаем 500 кругов и квадратов
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
function Figure(options) {
    this.figure = options.figure || "square";
    this.width = options.width || 100;
    this.height = options.height || 100;
    this.htmlItem = false;
}
Figure.prototype = Object.create(Figure);
 
Figure.prototype._isCircle = function() {
 
    return this.figure === "circle" ? true : false;
};
 
Figure.prototype.createOne = function(whereAppend){
    this.htmlItem = document.createElement("div");
 
    if (this._isCircle()) {
        this.htmlItem.style.borderRadius = "50%";
        this.htmlItem.classList.add("circle");
    } else {
        this.htmlItem.classList.add("square");
    }
 
    this.htmlItem.style.width = this.width + "px";
    this.htmlItem.style.height = this.height + "px";
    this.htmlItem.style.backgroundColor = "red";
 
 
    this.appendToHtml(whereAppend);
}
Figure.prototype.appendToHtml = function (selector) {
    var whereAppend = document.querySelector(selector);
    whereAppend.appendChild(this.htmlItem);
}
Figure.prototype.addEvent = function (evName, fn) {
    this.htmlItem.addEventListener(evName, fn);
}
 
for (var i = 0; i < 100; i++) {
    if (i % 2 === 1) {
        circ = new Figure({figure: "circle", width:200, height:200});
        circ.createOne(".elems");
        circ.addEvent("click", function () {
            alert("clicked on circle");
        });
    } else {
        square = new Figure({figure: "square", width:200, height:200});
        square.createOne(".elems");
        square.addEvent("click", function () {
            alert("clicked on square");
        });
    }
};
Добавлено через 5 минут
https://fiddle.jshell.net/38q65wxe/
1
0 / 0 / 0
Регистрация: 16.01.2016
Сообщений: 11
17.01.2016, 17:44  [ТС]
Выглядит неплохо)А как задействовать цикл, чтобы и по горизонтали накидать объектов?
0
123 / 62 / 32
Регистрация: 10.01.2014
Сообщений: 241
17.01.2016, 17:50
Лучший ответ Сообщение было отмечено Jective как решение

Решение

Jective, перед 29 строкой:
JavaScript
1
 this.htmlItem.style.display = "inline-block";
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
17.01.2016, 17:50
Помогаю со студенческими работами здесь

обратиться к кнопке, которых много
Добрый день формучане! На странице есть несколько кнопок &quot;изменить&quot;, каждый разу у них разные id кроме btnChange* с этим понятно. Как...

Сделать много уникальных обработчиков
Привет всем, подскажите пожалуйста как поступить в данной ситуации например есть 3 одинаковых кнопки (их может быть сколь угодно) и 3...

Window.print() много пустых страниц
Приветствую. При печати html-таблицы, создается еще куча пустых страниц. Бывает одна, а бывает 150-400 штук! Может знает кто почему так...

Яндекс карты, поставить много меток
Добрый день всем форумчанам. Люди помогите мне поставить на яндекс карту много-много меток. вот мой код с одной меткой как сделать так...

Проблема с элементом textarea: Слишком много данных
Привет, у меня неожиданно возникла проблема: я создаю скрипт, который вынимает данные из базы данныхи помещает их в форму, а конкретнее в...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
Установка Qt-версии Lazarus IDE в Debian Trixie Xfce
volvo 10.02.2026
В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .
SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer
8Observer8 08.02.2026
Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .
SDL3 для Web (WebAssembly): Основы отладки веб-приложений на SDL3 по USB и Wi-Fi, запущенных в браузере мобильных устройств
8Observer8 07.02.2026
Содержание блога Браузер Chrome имеет средства для отладки мобильных веб-приложений по USB. В этой пошаговой инструкции ограничимся работой с консолью. Вывод в консоль - это часть процесса. . .
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве
8Observer8 02.02.2026
Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .
Философия технологии
iceja 01.02.2026
На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru