Ребят помогите со скриптом. Для блоков.

Сообщений: 20 Регистрация: Июл 2012

20 Июля 2012 13:34

<div id="blok001"><span class='new_cena001'>300</span> <imput class='kol001' value='1'></div> блок 2 <div id="blok002"><span class='new_cena002'>300</span> <imput class='kol003' value='1'></div> блок 3 <div id="blok003"><span class='new_cena003'>300</span> <imput class='kol003' value='1'></div> блок 4 <div id="blok004"><span class='new_cena004'>300</span> <imput class='kol004' value='1'></div>

Есть 4 блока в блоках span цена товара надо написать скипт который будет брать значение из спан умножать на значение <imput> и в этот же спан возвращать уже результат формулы. И еще допустим 4 блоков <span> и в блок < div id="ob_summ"></div> вывести сумму всех 4 блоков

Александр Алисейко

Сообщений: 251 Регистрация: Ноя 2010

20 Июля 2012 15:54

А что за новый супер-мега-тег iMput?? HTML 6? :DНаписал в лоб. По любому, можно (нужно) проще и красивее. Но выводить тут все это лень, да еще и за спасибо, так что довольствуйтесь наколенной 5-ти минуткой.

Значение спанов меняется автоматически на новое, когда input теряет фокус.

Код

<!DOCTYPE html>
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
      <script type="text/javascript">
         $(document).ready(function() {
               span1 = $('.new_cena001').html();  
               span2 = $('.new_cena002').html();  
               span3 = $('.new_cena003').html();  
               span4 = $('.new_cena004').html();  

               $('input.kol001').change(function () {
                     $('.new_cena001').html($(this).val()*span1); 

               });

               $('input.kol002').change(function () {
                     $('.new_cena002').html($(this).val()*span2);

               });

               $('input.kol003').change(function () {
                     $('.new_cena003').html($(this).val()*span3);

               });

               $('input.kol004').change(function () {
                     $('.new_cena004').html($(this).val()*span4);

               });

               $('button.click-me').click(function(){
                     $('#ob_summ').html(
                        Number($('.new_cena001').html()) + Number($('.new_cena002').html()) + Number($('.new_cena003').html()) + Number($('.new_cena004').html())
                     );   
               });
         });
      </script>
   </head>
   <body>
      Блок 1
      <div id="blok001">
         <span class='new_cena001'>300</span> <br />
         <input class='kol001' value='1' />
      </div> 

      блок 2 
      <div id="blok002">
         <span class='new_cena002'>300</span> <br />
         <input class='kol002' value='1' />
      </div> 

      блок 3 
      <div id="blok003">
         <span class='new_cena003'>300</span> <br />
         <input class='kol003' value='1' />
      </div> 

      блок 4 
      <div id="blok004">
         <span class='new_cena004'>300</span> <br />
         <input class='kol004' value='1' />
      </div>

      <div id="ob_summ"></div>

      <button class="click-me">Пишем в DIV</button>
   </body>
</html>

Изменено: Александр Алисейко - 20 Июля 2012 17:03

Создание сайтов, верстка | http://www.weesite.ru
Веточка на супре | http://www.cy-pr.com/forum/f74/t16076/

сергей Самойловский Сообщений: 20 Регистрация: Июл 2012	#3 21 Июля 2012 20:28 Я сам сделал только вот так <div id="blok001"> Цена товара - <span id="cena001">123</span><br> Количество - <input id="kol001" value="1"><br> Сумма покупки - <span id="sum001">123</span> </div><hr> <div id="blok002"> Цена товара - <span id="cena002">234</span><br> Количество - <input id="kol002" value="1"><br> Сумма покупки - <span id="sum002">234</span> </div><hr> <script> function myFunc (ev) { var e = ev \|\| window.event, o = e.srcElement \|\| e.target, n = o.id.substr (3); if (o.value.replace (/\d/g, '').length) {alert ('Неверно!'); document.getElementById ('sum' + n).innerHTML = 'ОШИБКА'; return} document.getElementById ('sum' + n).innerHTML = document.getElementById ('cena' + n).innerHTML * o.value +" руб."; } var obj = document.getElementsByTagName ('input'); for (var j = 0, lj = obj.length; j < lj; j++) if (obj [j].id.substring (0, 3) == 'kol') {obj [j].oninput = myFunc; obj [j].onpropertychange = myFunc} </script> Все равно спасибо

Новые темы	Объявления	Свободное общение
08:40 Изменение в продвижении под Яндекс 02:11 LGaming - экосистема и партнерская программа в gambling и betting вертикалях 22:17 Gogetlinks - ссылки навсегда на качественных сайтах с гарантией индексации! - 2 22:15 Устали от Пустых Обещаний? Market-Place.su даёт реальные деньги! 12:34 Артемий Лебедев: «ВКонтакте» станет «новым поисковиком» 14:50 Плагин Telegram posting 20:43 Webvork - международная товарная СРА сеть с сертифицированными офферами на Европу.	10:51 Whatsapp рассылки и реселлерская программа 09:34 Sapfirex.com - Современный сервис обмена криптовалют 22:06 Вечные ссылки с ТОПОВЫХ ресурсов! Размещение вечных трастовых ссылок с тИЦ от + 1000 до +45000 22:05 Готовые аккаунты Яндекс Директ с пройденной модерацией, с отлежкой, трастовые 21:59 Продаются аккаунты Яндекс Директ без НДС (валюта USD). +20% к вашему бюджету 21:18 Coin Click.cc - Быстрый и надежный обмен электронных валют в два клика 14:07 - Вечные ссылки с трастовых сайтов 2024 проверен FastTrust	09:27 Ням-ням! - 8 деликатесов, которые когда-то ели только бедные люди 02:21 Точные прогнозы на футбол 21:17 Шашлыки в 2012-2022 году 13:49 Не храните данные на жёстких дисках 08:22 Инфобизнесменша приобрела курсы у другой за 5,5 млн рублей, но не стала богатой. Она обратилась в полицию 08:15 Новый уровень мошенничества: как россиян обманывают с помощью фейковых порнороликов 21:40 Telegram не смог провести различие между требованиями автократических режимов и законными демократическими запросами

Новые темы

Объявления

Свободное общение

08:40 Изменение в продвижении под Яндекс
02:11 LGaming - экосистема и партнерская программа в gambling и betting вертикалях
22:17 Gogetlinks - ссылки навсегда на качественных сайтах с гарантией индексации! - 2
22:15 Устали от Пустых Обещаний? Market-Place.su даёт реальные деньги!
12:34 Артемий Лебедев: «ВКонтакте» станет «новым поисковиком»
14:50 Плагин Telegram posting
20:43 Webvork - международная товарная СРА сеть с сертифицированными офферами на Европу.

10:51 Whatsapp рассылки и реселлерская программа
09:34 Sapfirex.com - Современный сервис обмена криптовалют
22:06 Вечные ссылки с ТОПОВЫХ ресурсов! Размещение вечных трастовых ссылок с тИЦ от + 1000 до +45000
22:05 Готовые аккаунты Яндекс Директ с пройденной модерацией, с отлежкой, трастовые
21:59 Продаются аккаунты Яндекс Директ без НДС (валюта USD). +20% к вашему бюджету
21:18 Coin Click.cc - Быстрый и надежный обмен электронных валют в два клика
14:07 - Вечные ссылки с трастовых сайтов 2024 проверен FastTrust

09:27 Ням-ням! - 8 деликатесов, которые когда-то ели только бедные люди
02:21 Точные прогнозы на футбол
21:17 Шашлыки в 2012-2022 году
13:49 Не храните данные на жёстких дисках
08:22 Инфобизнесменша приобрела курсы у другой за 5,5 млн рублей, но не стала богатой. Она обратилась в полицию
08:15 Новый уровень мошенничества: как россиян обманывают с помощью фейковых порнороликов
21:40 Telegram не смог провести различие между требованиями автократических режимов и законными демократическими запросами

13.11.2016 22:20	Помогите со скриптом для накрутки ботов
13.10.2016 23:15	Помогите, пожалуйста, решить проблему.
22.01.2016 14:52	Помогите настроить tooltip
23.08.2015 08:01	Помогите внедрить на сайт меню вырезанное с другого сайта
23.08.2015 01:47	Помогите допилить скрипт. Футер ползет до бесконечности вниз