Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.07.2015, 12:32
yoo yoo вне форума
Новичок на форуме
Отправить личное сообщение для yoo Посмотреть профиль Найти все сообщения от yoo
 
Регистрация: 17.07.2015
Сообщений: 5

Несколько скриптов на одной странице
Привет ребята! Подскажите пожалуйста как можно реализовать дубли этого скрипта, на одной странице. Нашел у вас на форуме замечательный скрипт счётчика. И не могу разобраться, как можно сделать много счётчиков на одной странице. Уже пробовал менять getElementById. Не выходит, запускается только один счётчик. Вот скрипт:
<!DOCTYPE HTML>
<html>
  <head>
  <meta charset="utf-8">
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
  </head>
  <body>
<div id="title">Start</div>
<a id="waiting" href="http://ya.ru/" target="_blank" data-load="1">Click</a>

<script>
function eHide(sec, checkLocalStorage) {
  if (checkLocalStorage && localStorage.getItem('eHideSec')) {
    var savedSec = localStorage.getItem('eHideSec');
    if (savedSec > 0) sec = savedSec;
  }
  var time = sec;
  var hour = parseInt(time / 3600);
  if (hour < 1) hour = 0;
  time = parseInt(time - hour * 3600);
  if (hour < 10) hour = '0' + hour;
  var minutes = parseInt(time / 60);
  if (minutes < 1) minutes = 0;
  time = parseInt(time - minutes * 60);
  if (minutes < 10) minutes = '0' + minutes;
  var seconds = time;
  if (seconds < 10) seconds = '0' + seconds;

  document.getElementById("title").innerHTML = 'Wait ' + hour + ':' + minutes + ':' + seconds;
  localStorage.setItem('eHideSec', sec);
  sec--;

  if (sec >= 0) {
    window.setTimeout(function () {
      eHide(sec);
    }, 1000);
    enabled = false;
  } else {
    document.getElementById("title").innerHTML = 'The End!';
	$("#waiting").attr("data-load", '1');
  }
}

if (localStorage.getItem('eHideSec') && localStorage.getItem('eHideSec') > 0) {
  $("#waiting").attr("data-load", '0');
  eHide(15, true);
}

$("#waiting").on("click", function () {
  if ($(this).attr("data-load") == 1) {
    $(this).attr("data-load", '0');
    eHide(15, true);
  } else {
      alert('forbidden')
      return false;
    }
});
</script>

  </body>
</html>



Заранее спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 17.07.2015, 13:02
Аватар для Leon-on12
Аспирант
Отправить личное сообщение для Leon-on12 Посмотреть профиль Найти все сообщения от Leon-on12
 
Регистрация: 07.04.2015
Сообщений: 65

Надо скопировать этот скрипт. И поменять в нём все значения основных переменных. Если таймера всего 2, тогда это имеет смысл.

Если таймеров неограниченное множество, тогда надо призадуматься.
Теоретически можно это сделать. Но лучше просто скопировать скрипт, и добавить во все переменные например цыфру 1.
Ну и в ключ локального хранилища тоже.


<html>
  <head>
  <meta charset="utf-8">
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
  </head>
  <body>
<div id="title">Start</div>
<div id="title1">Start</div>
<a id="waiting" href="http://ya.ru/" target="_blank" data-load="1">Click</a>
 
<script>
function eHide(sec, checkLocalStorage) {
  if (checkLocalStorage && localStorage.getItem('eHideSec')) {
    var savedSec = localStorage.getItem('eHideSec');
    if (savedSec > 0) sec = savedSec;
  }
  var time = sec;
  var hour = parseInt(time / 3600);
  if (hour < 1) hour = 0;
  time = parseInt(time - hour * 3600);
  if (hour < 10) hour = '0' + hour;
  var minutes = parseInt(time / 60);
  if (minutes < 1) minutes = 0;
  time = parseInt(time - minutes * 60);
  if (minutes < 10) minutes = '0' + minutes;
  var seconds = time;
  if (seconds < 10) seconds = '0' + seconds;
 
  document.getElementById("title").innerHTML = 'Wait ' + hour + ':' + minutes + ':' + seconds;
  localStorage.setItem('eHideSec', sec);
  sec--;
 
  if (sec >= 0) {
    window.setTimeout(function () {
      eHide(sec);
    }, 1000);
    enabled = false;
  } else {
    document.getElementById("title").innerHTML = 'The End!';
    $("#waiting").attr("data-load", '1');
  }
}
 
if (localStorage.getItem('eHideSec') && localStorage.getItem('eHideSec') > 0) {
  $("#waiting").attr("data-load", '0');
  eHide(15, true);
}
 
$("#waiting").on("click", function () {
  if ($(this).attr("data-load") == 1) {
    $(this).attr("data-load", '0');
    eHide(15, true);
  } else {
      alert('forbidden')
      return false;
    }
});
</script><script>
function eHide1(sec1, checkLocalStorage1) {
  if (checkLocalStorage1 && localStorage.getItem('eHideSec1')) {
    var savedSec1 = localStorage.getItem('eHideSec1');
    if (savedSec1 > 0) sec1 = savedSec1;
  }
  var time = sec1;
  var hour = parseInt(time / 3600);
  if (hour < 1) hour = 0;
  time = parseInt(time - hour * 3600);
  if (hour < 10) hour = '0' + hour;
  var minutes = parseInt(time / 60);
  if (minutes < 1) minutes = 0;
  time = parseInt(time - minutes * 60);
  if (minutes < 10) minutes = '0' + minutes;
  var seconds = time;
  if (seconds < 10) seconds = '0' + seconds;
 
  document.getElementById("title1").innerHTML = 'Wait ' + hour + ':' + minutes + ':' + seconds;
  localStorage.setItem('eHideSec', sec1);
  sec1--;
 
  if (sec1 >= 0) {
    window.setTimeout(function () {
      eHide1(sec1);
    }, 1000);
    enabled = false;
  } else {
    document.getElementById("title1").innerHTML = 'The End!';
    $("#waiting").attr("data-load", '1');
  }
}
 
if (localStorage.getItem('eHideSec') && localStorage.getItem('eHideSec') > 0) {
  $("#waiting").attr("data-load", '0');
  eHide1(15, true);
}
 
$("#waiting").on("click", function () {
  if ($(this).attr("data-load") == 1) {
    $(this).attr("data-load", '0');
    eHide1(15, true);
  } else {
      alert('forbidden')
      return false;
    }
});
</script>
 
  </body>
</html>

Последний раз редактировалось Leon-on12, 17.07.2015 в 13:11. Причина: Дописал код.
Ответить с цитированием
  #3 (permalink)  
Старый 17.07.2015, 13:36
yoo yoo вне форума
Новичок на форуме
Отправить личное сообщение для yoo Посмотреть профиль Найти все сообщения от yoo
 
Регистрация: 17.07.2015
Сообщений: 5

Спасибо большое! Всё получилось. Да, по задумке надо много счётчиков, но теперь хоть понимаю как их наделать. Ещё раз спасибо!
Ответить с цитированием
  #4 (permalink)  
Старый 17.07.2015, 14:09
Аватар для Leon-on12
Аспирант
Отправить личное сообщение для Leon-on12 Посмотреть профиль Найти все сообщения от Leon-on12
 
Регистрация: 07.04.2015
Сообщений: 65

Сообщение от yoo
Спасибо большое! Всё получилось. Да, по задумке надо много счётчиков, но теперь хоть понимаю как их наделать. Ещё раз спасибо!
Если счётчиков много есть такое решение(кривое как...****):
Сделать генератор счётчиков, который будет вставлять их в html. И все глобальные переменные id ключи и название самой функции менять.
Как-то так.

<div id="timers"></div>


var i = 1;
function addTimer(){
var eHide = "eHide";
var sec = "sec";
var checkLocalStorage = "checkLocalStorage";
var eHideSec = "eHideSec";
var title = "title";
document.getElementById("timers").innerHTML += '<script>function' + eHide + i +'(' +sec + i + ',' + checkLocalStorage +i +') {  if ('+checkLocalStorage +i +'&& localStorage.getItem("'+eHideSec + i+'")) {var savedSec = localStorage.getItem("'+eHideSec + i+'");if (savedSec > 0) '+sec + i+' = savedSec;}var time = '+sec + i+';var hour = parseInt(time / 3600);if (hour < 1) hour = 0;time = parseInt(time - hour * 3600);if (hour < 10) hour = "0" + hour;var minutes = parseInt(time / 60);if (minutes < 1) minutes = 0;time = parseInt(time - minutes * 60);if (minutes < 10) minutes = "0" + minutes;var seconds = time;if (seconds < 10) seconds = "0" + seconds;document.getElementById("'+title+i +'").innerHTML = "Wait " + hour + ":" + minutes + ":" + seconds;localStorage.setItem("'+eHideSec + i+'", '+sec + i+');'+sec + i+'--;if ('+sec + i+' >= 0) {window.setTimeout(function () {' + eHide +i + '('+sec + i+');}, 1000);enabled = false;} else {document.getElementById("'+title+i +'").innerHTML = "The End!";$("#waiting").attr("data-load", "1");}}if (localStorage.getItem("'+title+i +'") && localStorage.getItem("'+eHideSec + i+'") > 0) {$("#waiting").attr("data-load", "0");' + eHide +i + '(15, true);}$("#waiting").on("click", function () {if ($(this).attr("data-load") == 1) {$(this).attr("data-load", "0");' + eHide +i + '(15, true);} else {alert("forbidden")return false;}});</script>';
i++;
}


Только когда сделал понял что не нужно было выделять все эти переменные, можно было обойтись только i.
Главное не забудь что всё это должно быть одной строчкой, вроде как. Иначе js не прочтёт. Не знаю почему так. Но кавычки js не умеет соединять через строки.

Последний раз редактировалось Leon-on12, 17.07.2015 в 14:13.
Ответить с цитированием
  #5 (permalink)  
Старый 17.07.2015, 15:02
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,718

Да вы что господа опухли? Сделайте обычную функцию или объект с этой рассыпухи и будет вам 100500 счетчиков. Чтобы для каждого был свой кармашек в бд - используйте либо имя счетчика как namespace, либо явно передавайте в опциях.
Ответить с цитированием
  #6 (permalink)  
Старый 17.07.2015, 15:07
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,718

И вообще какой-то бред:

Сообщение от yoo
if (minutes < 10) minutes = '0' + minutes;
нафига это надо? Нет что ли нормальных методов форматирования целых?
Ответить с цитированием
  #7 (permalink)  
Старый 17.07.2015, 15:36
Аватар для Leon-on12
Аспирант
Отправить личное сообщение для Leon-on12 Посмотреть профиль Найти все сообщения от Leon-on12
 
Регистрация: 07.04.2015
Сообщений: 65

Сообщение от kostyanet
Да вы что господа опухли? Сделайте обычную функцию или объект с этой рассыпухи и будет вам 100500 счетчиков. Чтобы для каждого был свой кармашек в бд - используйте либо имя счетчика как namespace, либо явно передавайте в опциях.
Я просто безумен. Мне немного знаний и мозга не хватает. То есть сделать все переменные локальными и что бы они с одинаковыми именами там работали независимо, мне мозг позволяет. Но как сделать сами функции независимыми. Непонятно для меня.
Сообщение от kostyanet
нафига это надо? Нет что ли нормальных методов форматирования целых?
Если вспомнишь мой кусок кода с болтающейся кнопкой старт, то даже там это было сделано приличней. Но я подумал что в этом есть, наверное, какой-то высший смысл.
Ответить с цитированием
  #8 (permalink)  
Старый 17.07.2015, 15:54
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,718

Сообщение от Leon-on12
Но как сделать сами функции независимыми
Накопировать и все. Не тексты, не вручную, а коды, скриптом.
Ответить с цитированием
  #9 (permalink)  
Старый 17.07.2015, 16:10
yoo yoo вне форума
Новичок на форуме
Отправить личное сообщение для yoo Посмотреть профиль Найти все сообщения от yoo
 
Регистрация: 17.07.2015
Сообщений: 5

Чёт этот вариант у меня не хочет работать. Если можно мне ещё подсказать на счёт первого варианта. Вот если счётчик один, то при обновлении страницы, таймер не сбивается, а если два или больше, при обновлении сбивается. В чём там может быть проблема? Просто мне он подошел потому что таймер не сбивается. Или может есть подсказка как вот такой доделать, чтоб время не сбивалось.


<input id="Bit2" value="Knopka" onclick="Bit2()">

var W;
function Bit2 ()
{
var o = document.getElementById ('Bit2');
o.disabled = 1; o.value = 'Ждать 1m.';
W = window.open ('1.html', 'hero');
myTimer ();

function myTimer ()
   {
   var w = o.value.split ('Ждать ') [1],
       t = 60 * parseInt (w) - 1 + ((w.indexOf ('m. ') != -1) ? parseInt (w.split ('m. ') [1]) : 0),
       m = Math.floor (t / 60);
       s = t % 60;
   if (t) {o.value = 'Ждать ' + m + 'm.' + (s ? (' ' + s + 's.') : ''); setTimeout (myTimer, 1000)}
   else {o.value = 'Start'; o.disabled = 0; if (!W.closed) W.close ()}
   }
}
Ответить с цитированием
  #10 (permalink)  
Старый 17.07.2015, 16:14
Аватар для Leon-on12
Аспирант
Отправить личное сообщение для Leon-on12 Посмотреть профиль Найти все сообщения от Leon-on12
 
Регистрация: 07.04.2015
Сообщений: 65

Сообщение от kostyanet
Накопировать и все. Не тексты, не вручную, а коды, скриптом.
Так разве второй мой код не делает то самое копирование кода кодом?


Сообщение от yoo
а если два или больше, при обновлении сбивается
Странно. Во втором примере у меня не сбивается. В том таймере используется localStorage. Почитай что это такое. Полезная вещь, и совсем не сложная. Скореее всего происходит конфликт функций. Они борются за один и тот же локалсторедж.
Так что дело в нём. Смотри внимательно на ключ localStorage

Последний раз редактировалось Leon-on12, 17.07.2015 в 16:17.
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Несколько одинаковых форм обратной связи на одной странице stalex jQuery 14 24.04.2018 17:25
Как создать несколько графиков GoogleCharts на одной странице? Sanu0074 Общие вопросы Javascript 10 23.02.2015 20:21
Несколько модальных окон на одной странице pleymo jQuery 2 04.06.2014 09:24
Несколько таймеров на одной странице. Pothead Общие вопросы Javascript 1 27.05.2013 08:24
Несколько версий JQuery UI на одной странице. Casufi jQuery 2 10.11.2012 15:24