Есть вот такой выпадающий список: HTML: <select onchange="document.getElementById('id_2').innerHTML=values[this.selectedIndex]"> <option value="1" selected="selected">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> Используется вот этот массив HTML: <script> values=[ '300', '600', '900', '1200', '1500', '1800', '2100', '2400', '2700', '3000' ] values.undefined = '300'; </script> В зависимости от выбранного элемента выводится стоимость: HTML: <b>Total:</b> <span id="id_2"></span>$<br> Проблема в том, что таким скриптом задаётся содержимое только первого тега <span>. А мне нужно выводить в двух местах. То есть в таком случае HTML: <b>Total:</b> <span id="id_2"></span>$<br> <b>Total:</b> <span id="id_2"></span>$<br> будет выведен результат только в первом теге. В чём ошибка, как сделать так, чтобы выводилось сразу в двух тегах <span> ?
Можно и с одним ID. Способ 1. Проходим с each элементы и проверяем; Способ 2. использовать атрибут data; Способ 3. Обращение к элементам как к элементам массива (http://api.jquery.com/get/ ); Далеко не все способы, но лень.
Благодарю всех за оказанную мне помощь! У меня еще два вопроса возникло, прошу помочь знающих. На странице с помощью javascript можно добавить неограниченное количество вот таких парных тегов input: HTML: <input type="text" name="moneypak[]" size="14"><input type="text" name="amount[]" size="6"> Этих пар может быть и одна, а может и десять подряд. Пользователь будет вводить в эти поля только цифры. С этими тегами нужно провести такие действия: 1)Проверить ввёл ли пользователь в первый тег input строку длиной 14 символов или нет. Для этого у меня есть вот такая функция: Code: function validate_moneypak(){ valid = true; if(document.moneypak.vouchid.value.length != "14"){ alert("Enter valid MoneyPak!"); valid = false; } return valid; } </script> 2)Все цифры из input name amount[] сложить и вывести на странице. Чтобы было проще понять вот схема: Если бы кол-во полей было всегда одинаковое, и имели разные имена - наверняка я бы решил эту задачку без проблем. Но к сожалению с неизвестным количеством полей возникают трудности, поэтому прошу помощи
1. Создаваемому инпуту moneypak[] вешать событие .onblur = validateMoneypak; Code: var validateMoneypak = function () { if (this.value.length != 14) { // this - сам input alert("Enter valid MoneyPak!"); return false; // хз зачем ретурны, оставил как было. } return true; }; 2. Не знаю в какой момент должен срабатывать подсчёт, но вот метод: берём родителя инпутов любым из методов (на случай, если ещё где-то на странице появятся инпуты с именем amount[], а так же для быстроты скрипта): Code: var amountsParent = document.getElement[s]By[id/TagName/Name/ClassName](), calculateSum = function () { var amountInputs = amountsParent.getElementsByName('amount[]'), sum = 0; amountInputs.forEach(function (item) { sum += item.value; }); console.log(sum); return sum; }; Не тестил, может где-то опечатался ) Можно было бы сделать и более красиво, но не знаю точной реализации другого кода и надобности в этом.
Melfis, первый пункт я решил. остался второй, но я решил сделать вот так: Code: function calc(){ input = document.getElementsByTagName('input'); for(i=0;i<(input).length;i++){ if(input[i].getAttribute('name')=='amount[]'){ alert(input[i].getAttribute('value')); } } } Но не могу понять как alert() заменить на +=, и в конце выполнения функции сделать return результата.
PHP: function calc() { var input = document.getElementsByTagName('input'); var result = 0; for(i=0;i<(input).length;i++){ if(input[i].getAttribute('name')=='amount[]'){ result += parseInt(input[i].value); } } return result; }
Есть вот такая форма с неограниченным количеством тегов input: HTML: <form action="checkout.php" method="POST" name="moneypak" onsubmit="return moneypak();"> <input type="text" name="moneypak[]" size="14" value=""> <input type="text" name="moneypak[]" size="14" value=""> <input type="text" name="moneypak[]" size="14" value=""> <input type="submit" value="PAY MONEYPAK"> </form> В этой форме при нажатии на кнопку "PAY MONEYPAK" должны произойти такие проверки: 1)В одном(первом) поле обязательно должно быть 14 цифр 2)Остальные поля должны быть либо 14 цифр, либо пустые. Для этого я написал вот такую функцию, только где-то неизвестно где закралась ошибка. При сабмите формы с неправильно заполнеными полями форма успешно сабмитится, игнорируя функцию moneypak(). Прошу помощи в поиске проблемы Собственно функция: Code: function moneypak(){ input = document.getElementsByTagName('input'); test = false; for(i=0;i<(input).length;i++){ if(input[i].getAttribute('name')=='moneypak[]'){ if(input[i].getAttribute('value')!=''){ test = true; if(input[i].getAttribute('value').length!='14'){ test = false; input[i].style.border = "3px #EE36AE solid"; alert('MoneyPak must contain 14 chars!'); } } } } //alert(test); return test; }
PHP: function moneypak(){ var input = document.getElementsByTagName('input'); var result = true; for( i=0; i<(input).length; i++ ) { input[i].style.borderColor = ''; // Ставим цвет бордера - стандартным if( input[i].getAttribute('name') == 'moneypak[]' ) { if( i == 0 && input[i].value.length != 14 ) { // Если первый инпут не 14 символов input[i].style.borderColor = '#EE36AE'; result = false; }else { // Проверяем оставшиеся инпуты if( input[i].value != '' && input[i].value.length != 14 ) { input[i].style.borderColor = '#EE36AE'; alert('MoneyPak must contain 14 chars!'); result = false; } } } } return result; } Не нужно использовать getAttribute для получения значения инпута. Эта функция возвратит только значение самого атрибута, а не то, что ввели в поле.
Как сделать так чтобы на странице пока не откроешь первую ссылку - все остальные были недоступны для нажатия, как только клик произошел вторая разблокировалась. По второй кликнул - третья разблокировалась?
Что-то типа того: PHP: <a href="#first">first</a> <br> <a href="#second">second</a> <br> <a href="#third">third</a> <br> <a href="#someLink">someLink</a> <br> <a href="#helloWorld">helloWorld</a> <br> <a href="#hi-hi-hi">hi-hi-hi</a> <script type="text/javascript"> var clicked = {}; for( var itemId in document.getElementsByTagName('a') ) { if( !isNaN(parseFloat(itemId)) ) { document.getElementsByTagName('a')[ itemId ].setAttribute('rel', itemId); document.getElementsByTagName('a')[ itemId ].onclick = function() { var thisId = this.getAttribute('rel'); if( thisId == 0 ) { clicked[ thisId ] = true; }else { if( !clicked[ thisId - 1] ) return false; else clicked[ thisId ] = true; } } } } </script>
Пока что сделал тестовую страницу <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <meta name="author" content="zalypa"> <title>Untitled - 2</title> </head> <body> <a href="#first">first</a> <br> <a href="#second">second</a> <br> <a href="#third">third</a> <br> <a href="#someLink">someLink</a> <br> <a href="#helloWorld">helloWorld</a> <br> <a href="#hi-hi-hi">hi-hi-hi</a> <script type="text/javascript"> var clicked = {}; for( var itemId in document.getElementsByTagName('a') ) { if( !isNaN(parseFloat(itemId)) ) { document.getElementsByTagName('a')[ itemId ].setAttribute('rel', itemId); document.getElementsByTagName('a')[ itemId ].onclick = function() { var thisId = this.getAttribute('rel'); if( thisId == 0 ) { clicked[ thisId ] = true; }else { if( !clicked[ thisId - 1] ) return false; else clicked[ thisId ] = true; } } } } </script> </body> </html>
Что работает? Мне надо чтобы изначально ссылка первая была активной), а на остальные невозможно было кликнуть. А сейчас на любую кликаешь, будь она в конце списка, вначале, в середине - она не заблокирована. Надо чтоб пока не кликнешь на first невозможно было кликнуть на second
ну какбе пока на 1 ссылку не нажмешь, вторая не нажмется, всмысле по адресу который указан в href - перехода не будет.
Точно! Работает) Это я чето туплю). А как еще сделать так чтобы у разблокированной сцылки был такой например цвет #333333, а у других #646363? Заранее спасибо!
