Перейти из форума на сайт.

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в on-line?
Вход • Забыли пароль? • Первый раз на этом сайте? • Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » вопросы по javascript

Модерирует : Cheery

 Версия для печати • Подписаться • Добавить в закладки
Страницы: 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 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125

Открыть новую тему     Написать ответ в эту тему

D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
1) Точно, javascript)
2) Да, на строку. В идеале предполагается, что на странице уже будет 10 ссылок с последовательными номерами, вида:

Код:
 
<a href='/f1.highres'><img src='/f1.thumbnail'></a>
<a href='/f2.highres'><img src='/f2.thumbnail'></a>
<a href='/f3.highres'><img src='/f3.thumbnail'></a>
<a href='/f4.highres'><img src='/f4.thumbnail'></a>
<a href='/f5.highres'><img src='/f5.thumbnail'></a>
...
 

Тогда как кнопка после этих ссылок — по нажатию по ней, каждый раз будет создавать продолжение тех же ссылок, начиная с 11-ти:

Код:
 
<a href='/f11.highres'><img src='/f11.thumbnail'></a>
...
 

 
 
 
Добавлено:
Mavrikii
Но такой функционал подошёл бы, только если можно будет использовать множество таких блоков на странице, где последовательно идут несколько ссылок и кнопка с подгрузкой ссылок, потом опять несколько ссылок и кнопка с подгрузкой ссылок, и так далее.
Всего записей: 1522 | Зарегистр. 05-04-2010 | Отправлено: 07:51 12-09-2020 | Исправлено: D1D1D1D, 07:52 12-09-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D
чистый js или есть jQuery (с ним проще)?
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 08:08 12-09-2020
D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Я бы и jQuery подключил) Достаточно же будет просто указать ссылку на jQuery в коде страницы?
Всего записей: 1522 | Зарегистр. 05-04-2010 | Отправлено: 08:09 12-09-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
Достаточно же будет просто указать ссылку на jQuery в коде страницы?

в голове, чтобы jQuery уже был доступен на момент вызова кода.. либо код после (ниже) его подключения.
например так, чтобы не возиться с парсингом формата добавляемого он сделан в виде шаблона
https://jsfiddle.net/vzx576eh/
так же указано с какого номера продолжать и на каком остановиться (если нужно)
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 08:45 12-09-2020 | Исправлено: Mavrikii, 08:46 12-09-2020
D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Спасибо! Я подключил jQuery и вот так прописал код в HTML-файл — по какой причине он не срабатывает локально?

Код:
 
<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script type="text/javascript">
$('button').on('click', function() {
  var o = $(this),
    i = o.data('start');
  if (i > o.data('end')) return;
  o.data('start', ++i);
  $(o.data('target')).append(o.data('template').replace(/$i/g, i));
})
 
</script>
</head>
<body>
 
<div id='block1'>
<a href='/f1.highres'><img src='/f1.thumbnail'></a>
<a href='/f2.highres'><img src='/f2.thumbnail'></a>
<a href='/f3.highres'><img src='/f3.thumbnail'></a>
<a href='/f4.highres'><img src='/f4.thumbnail'></a>
<a href='/f5.highres'><img src='/f5.thumbnail'></a>
</div>
<button data-target='#block1' data-start='5' data-end='10' data-template='<a href=&quot;/$i.highres&quot;><img src=&quot;/$i.thumbnail&quot;></a>'>
Click me
</button>

И возможно ли сделать, чтобы выводилось не одно изображение за раз, а 200?
Всего записей: 1522 | Зарегистр. 05-04-2010 | Отправлено: 09:13 12-09-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
по какой причине он не срабатывает локально?

многие браузеры блокируют js загруженный с диска - для безопасности.
 
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 09:16 12-09-2020
D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
 
Так тоже:

Код:
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>

Всего записей: 1522 | Зарегистр. 05-04-2010 | Отправлено: 09:23 12-09-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
Так тоже:

смотрите консоль браузера на сообщения об ошибке.
но

Цитата:
$('button').on('click', function() {

на момент вызова кнопки еще нет!
обернуть в  

Код:
$(function() {
.. тут этот код ...
});

 

Цитата:
И возможно ли сделать, чтобы выводилось не одно изображение за раз, а 200?
 

можно, но лучше сразу говорить все, а не по частям.
https://jsfiddle.net/kzq09fct/
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 09:28 12-09-2020 | Исправлено: Mavrikii, 09:29 12-09-2020
D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Спасибо Вам! Я кстати упоминал про вывод 10 ссылок за раз, просто казалось что потом цифру изменю)
 
Добавлено:
Mavrikii
Заметил, что ссылки отображаются без цифр. В чем может быть дело?
Всего записей: 1522 | Зарегистр. 05-04-2010 | Отправлено: 09:35 12-09-2020 | Исправлено: D1D1D1D, 09:36 12-09-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
 В чем может быть дело?

экранирование добавьте /\$i/g
ну либо в шаблоне заменить на любое другое знакоместо для замены
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 09:38 12-09-2020
D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Спасибо! Кстати, после обертки кода в «$(function() { ... });» — локальная работа jQuery тоже заработала.
Всего записей: 1522 | Зарегистр. 05-04-2010 | Отправлено: 09:42 12-09-2020
VVL99

Silver Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D
Возможно будет превышение по количеству ссылок при генерации.

----------
Гомосексуальность среди модераторов не является психическим расстройством, несмотря на синонимы этого понятия в русском языке.
Всего записей: 4160 | Зарегистр. 03-02-2011 | Отправлено: 17:03 12-09-2020
blaro



Member		Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Привет всем. Такой вопрос: учусь делать Drag-n-drop загрузку. Списал пример с сайта, чтобы понять как всё устроенно. Но вот при попытке вылетает сообщение об ошибке

Код:
 
Uncaught TypeError: files is undefined
    handleFiles http://127.0.0.1:5500/addFile.js:51
    handleDrop http://127.0.0.1:5500/addFile.js:37
    EventListener.handleEvent* http://127.0.0.1:5500/addFile.js:33
addFile.js:51:12
    handleFiles http://127.0.0.1:5500/addFile.js:51
    handleDrop http://127.0.0.1:5500/addFile.js:37
    (Async: EventListener.handleEvent)
    <anonymous> http://127.0.0.1:5500/addFile.js:33
 

Эта ошибка возникает в функции handleFiles, в строке files=[...files] (подчеркивает красным только многоточие). Не могу понять почему возникает ошибка. Подозреваю что данные из одной функции не передаются в другую. Далее приведу HTML и JavaScript

Код:
 
<div id="dragndroparea">
                <form class="my-form">
                    <p>Upload multiple files with the file dialog or by dragging and dropping images onto the dashed region</p>
                    <input type="file" id="fileElem" multiple accept="image/*" onchange="handleFiles(this.files)">
                    <label class="button" for="fileElem">Select files</label>
                </form>
                <progress id="progress-bar" max=100 value=0></progress>
                <div id="gallery"></div>
            </div>
 

"JavaScript"
Всего записей: 311 | Зарегистр. 29-01-2006 | Отправлено: 07:00 05-10-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
blaro

Цитата:
Uncaught TypeError: files is undefined
 

переменная files неопределена.

Цитата:
(подчеркивает красным только многоточие)

зависит от используемого редактора, так как это синтаксис новых версий js
 
можно определить посмотрев чему равны переменные в  

Цитата:
function handleDrop(e){
  let dt=e.dataTransfer;
  let files=dt.file;
  handleFiles(files);
}

 
ну либо onchange="handleFiles(this.files)"
смотреть что представляем собой this.files.
скорее всего срабатывает обработчик выше
dropArea.addEventListener('drop',handleDrop,false);
и событие не передает нужные данные
 
ну и смотрите консоль ошибок браузера на наличие сообщений
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 08:19 05-10-2020 | Исправлено: Mavrikii, 08:25 05-10-2020
blaro



Member		Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Mavrikii
Спасибо вам за ваш ответ. Я сегодня нашел причину.  Я просто стёр одну строку и выглядит сейчас так:
Было

Код:
 
function handleDrop(e){
  let dt=e.dataTransfer;
  let files=dt.file;
  handleFiles(files);
}  
 

Стало

Код:
 
function handleDrop(e){
  let files=e.dataTransfer.files;
  handleFiles(files);
}
 

Я не знаю почему функция не работала. Вобщем пошёл я дальше ковырять работу. Пойду поищу что можно в CSS сделать с Progress bar.
Всего записей: 311 | Зарегистр. 29-01-2006 | Отправлено: 21:22 05-10-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
blaro

Цитата:
Я не знаю почему функция не работала

потому, что .file != .files
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 00:50 06-10-2020
D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Привет. По какой причине онлайн не срабатывает следующий скрипт, который автоматически создаёт оглавление, собирая теги H3 ? — https://jsfiddle.net/hdma/Ls8n35u6/1/  (jquery кстати там не нужно - не смог убрать его из настроек)
 
При этом локально он работает.
Всего записей: 1522 | Зарегистр. 05-04-2010 | Отправлено: 05:02 06-10-2020 | Исправлено: D1D1D1D, 05:05 06-10-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
Uncaught TypeError: document.all.tags is not a function

document.all устаревший и неподдерживаемый всеми браузерами способ.
нужны элементы по тегам?  
document.getElementsByTagName('h3')
https://jsfiddle.net/qhjnkeam/
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 05:32 06-10-2020
D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Спасибо! А возможно, чтобы переход совершался по клику? https://jsfiddle.net/hdma/73ahvd6r/2/ В IE это работает, а, в частности, в Хроме не идёт
Всего записей: 1522 | Зарегистр. 05-04-2010 | Отправлено: 06:23 06-10-2020 | Исправлено: D1D1D1D, 06:24 06-10-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
а, в частности, в Хроме не идёт

потому, что <a name> тоже уже не используется.
добавьте нужными элементами id='...', тогда ссылка "#этот_ID" будет работать аналогично.
Всего записей: 16795 | Зарегистр. 20-09-2014 | Отправлено: 06:29 06-10-2020 | Исправлено: Mavrikii, 06:30 06-10-2020
Открыть новую тему     Написать ответ в эту тему

Страницы: 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 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125

Компьютерный форум Ru.Board » Интернет » Web-программирование » вопросы по javascript


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.Board
© Ru.B0ard 2000-2026

LiteCoin: LgY72v35StJhV2xbt8CpxbQ9gFY6jwZ67r

Рейтинг.ru

Рейтинг.ru