Несколько скриптов на одной странице
Привет ребята! Подскажите пожалуйста как можно реализовать дубли этого скрипта, на одной странице. Нашел у вас на форуме замечательный скрипт счётчика. И не могу разобраться, как можно сделать много счётчиков на одной странице. Уже пробовал менять 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, тогда это имеет смысл.
Если таймеров неограниченное множество, тогда надо призадуматься. Теоретически можно это сделать. Но лучше просто скопировать скрипт, и добавить во все переменные например цыфру 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> |
Спасибо большое! Всё получилось. Да, по задумке надо много счётчиков, но теперь хоть понимаю как их наделать. Ещё раз спасибо!
|
Цитата:
Сделать генератор счётчиков, который будет вставлять их в 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 не умеет соединять через строки. |
Да вы что господа опухли? Сделайте обычную функцию или объект с этой рассыпухи и будет вам 100500 счетчиков. Чтобы для каждого был свой кармашек в бд - используйте либо имя счетчика как namespace, либо явно передавайте в опциях.
|
И вообще какой-то бред:
Цитата:
|
Цитата:
Цитата:
|
Цитата:
|
Чёт этот вариант у меня не хочет работать. Если можно мне ещё подсказать на счёт первого варианта. Вот если счётчик один, то при обновлении страницы, таймер не сбивается, а если два или больше, при обновлении сбивается. В чём там может быть проблема? Просто мне он подошел потому что таймер не сбивается. Или может есть подсказка как вот такой доделать, чтоб время не сбивалось.
<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 ()} } } |
Цитата:
Цитата:
Так что дело в нём. Смотри внимательно на ключ localStorage |
Второй почему-то не чего не происходит. Я наверно что-то не так сделал.
В html там только строчку <div id="timers"></div> ? И подключать jquery, нужно? |
Цитата:
Второй скрипт просто делает при вызове функции новый кусок кода. То есть новую функцию eHideХ() где Х номер таймера начиная с 1 по моему. Но тебе ещё надо запустить её передав в неё параметры. Это просто функция которая плодит тебе бесконечно много одинаковых функций с разными названиями. Не более. И не забывай вызывать функцию addTimer() что бы получить тймер до того как ты запустил таймер. |
Всё. Выяснил.
|
Цитата:
var Foo=function(a){ var b=a; return function(c){ return b+c; }; }; var foo0=Foo(1); var foo1=Foo(2); var foo2=Foo(3); var foo3=Foo(4); Сколько тут копий? И у каждой - своя опция внутри. Ну то есть это же вроде все знают что функция при вызове копируется, а если начинает сама себя вызывать - еще и еще и еще и еще и еще и еще и так далее пока не поймет что харе - будет копироваться и каждый раз с разными значениями тех же переменных. Самый реликтовый уровень. |
Чтобы не копировалась надо прототипировать, но я лично этого не умею. Сегодня задал этот вопрос в который раз - в очередной раз никто не ответил. Вероятно никто не знает как. :)
|
Часовой пояс GMT +3, время: 00:16. |