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

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в 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

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

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

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

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

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

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

в голове, чтобы jQuery уже был доступен на момент вызова кода.. либо код после (ниже) его подключения.
например так, чтобы не возиться с парсингом формата добавляемого он сделан в виде шаблона
https://jsfiddle.net/vzx576eh/
так же указано с какого номера продолжать и на каком остановиться (если нужно)
Всего записей: 15687 | Зарегистр. 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?
Всего записей: 1470 | Зарегистр. 05-04-2010 | Отправлено: 09:13 12-09-2020
Mavrikii

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

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

многие браузеры блокируют js загруженный с диска - для безопасности.
 
Всего записей: 15687 | Зарегистр. 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>

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

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

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

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

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

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

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

 

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

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

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

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

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

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

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

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

----------
Гомосексуальность среди модераторов не является психическим расстройством, несмотря на синонимы этого понятия в русском языке.
Всего записей: 4158 | Зарегистр. 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);
и событие не передает нужные данные
 
ну и смотрите консоль ошибок браузера на наличие сообщений
Всего записей: 15687 | Зарегистр. 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
Всего записей: 15687 | Зарегистр. 20-09-2014 | Отправлено: 00:50 06-10-2020
D1D1D1D

Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Привет. По какой причине онлайн не срабатывает следующий скрипт, который автоматически создаёт оглавление, собирая теги H3 ? — https://jsfiddle.net/hdma/Ls8n35u6/1/  (jquery кстати там не нужно - не смог убрать его из настроек)
 
При этом локально он работает.
Всего записей: 1470 | Зарегистр. 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/
Всего записей: 15687 | Зарегистр. 20-09-2014 | Отправлено: 05:32 06-10-2020
D1D1D1D

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

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

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

потому, что <a name> тоже уже не используется.
добавьте нужными элементами id='...', тогда ссылка "#этот_ID" будет работать аналогично.
Всего записей: 15687 | Зарегистр. 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

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


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

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

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru