Javascript.RU

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

Вытащить из тега span, обработать и перезаписать
Здравствуйте!
Я, как водится, новичок в программировании и начала "с места в карьер"=)
Мне нужно обработать форму особым образом и для этого я пытаюсь отладить маленький кусочек кода, где мне нужно
1)Считать значение span
2)Проверить был ли нажат чекбокс. Если да, то к общей сумме прибавить значение из span. Если нет - вычесть.
4)Записать внизу страницы в специальное место

HTML
<input type="checkbox" onchange="calc()" value="Услуга"/><span id="mon">3000</span>Услуга
<br/>
<div>Стоимость: <span id="result">0</span> руб.</div>

JS

*/
function calc() {


var mon = document.getElementById("mon");
var result = document.getElementById("result");
var msg = document.getElementedById("msg");
var price = 0;
price += parseInt(mon.value);
result.innerHTML = price;
}

</script>
Я даже без проверки на нажатие не могу значение из span обработать. Помогите, пожалуйста!

Последний раз редактировалось vetedde, 16.09.2014 в 22:31.
Ответить с цитированием
  #2 (permalink)  
Старый 16.09.2014, 22:09
Профессор
Отправить личное сообщение для tsigel Посмотреть профиль Найти все сообщения от tsigel
 
Регистрация: 12.12.2012
Сообщений: 1,398

не mon.value, а parseInt(mon.innerHTML)
Ответить с цитированием
  #3 (permalink)  
Старый 16.09.2014, 22:34
Интересующийся
Отправить личное сообщение для vetedde Посмотреть профиль Найти все сообщения от vetedde
 
Регистрация: 16.09.2014
Сообщений: 10

Ничего не изменилось=(
А почему innerHTML, я же вроде через document.getElementById получаю к ней доступ в функции?
И еще как сделать проверку нажат чекбокс или нет?
Ответить с цитированием
  #4 (permalink)  
Старый 16.09.2014, 23:27
Аватар для Safort
Профессор
Отправить личное сообщение для Safort Посмотреть профиль Найти все сообщения от Safort
 
Регистрация: 23.12.2013
Сообщений: 1,856

vetedde,
пара просьб на будущее:
1. Будь добр оформляй свой код, его очень не удобно читать. А ведь помощь нужна тебе, а не нам.
Как спросить, чтобы вам ответили
2. Пользуйся поиском перед тем, как создать тему. На все эти вопросы уже есть ответы.


Решение:
<input type="checkbox" onchange="calc()" value="Услуга"/>
  <span id="mon">3000</span> Услуга
  <br/>
  <div>Стоимость: <span id="result">0</span> руб.</div>
  <script>
    function calc() {
      var mon = parseInt(document.getElementById("mon").innerHTML);
 //считываем значение и приводим его к целочисленному типу
      var isChecked = document.querySelector('input').checked; //отмечен ли чекбокс
      var result = document.getElementById("result");  //куда выводить результат
      var price = 0;  //общая сумма

      // проверяем чекбокс
      if (isChecked) {
        price += mon;
      } else {
        price -= mon;
      }

      // var msg = document.getElementedById("msg");  //зачем тут это, если оно не используется?
      result.innerHTML = price;

    }
  </script>

Последний раз редактировалось Safort, 16.09.2014 в 23:29.
Ответить с цитированием
  #5 (permalink)  
Старый 17.09.2014, 09:40
Интересующийся
Отправить личное сообщение для vetedde Посмотреть профиль Найти все сообщения от vetedde
 
Регистрация: 16.09.2014
Сообщений: 10

Огромное спасибо!
То, что не используется забыла подтереть.
Обязательно почитаю правило оформления!
Ответить с цитированием
  #6 (permalink)  
Старый 17.09.2014, 19:07
Интересующийся
Отправить личное сообщение для vetedde Посмотреть профиль Найти все сообщения от vetedde
 
Регистрация: 16.09.2014
Сообщений: 10

В коде выше price каждый раз присваивается 0, поэтому стоимость выводится или 3000, или - 3000. Я попыталась, чтобы функция вытаскивала из span значение по аналогии, но почему-то у меня не работает. Вот в чем я делаю ошибку?

<input type="checkbox" onchange="calc()" value="Услуга"/>
  <span id="mon">3000</span> руб. Услуга
  <br/>
  <div>Стоимость: <span id="result">0</span> руб.</div>

<script>
    function calc() {
      var mon = parseInt(document.getElementById("mon").innerHTML); //Получаем цену услуги
      var isChecked = document.querySelector('input').checked; //отмечен ли чекбокс
      var result = parseInt(document.getElementById("result").innerHTML); //Получаем итоговую сумму
      var price = 0;
      var price += result;
      // проверяем чекбокс
      if (isChecked) {
        price += mon;
      } else {
        price -= mon;
      }

      // var msg = document.getElementedById("msg");  //зачем тут это, если оно не используется?
      result.innerHTML = price;

    }
  </script>
Ответить с цитированием
  #7 (permalink)  
Старый 17.09.2014, 20:31
Аватар для Safort
Профессор
Отправить личное сообщение для Safort Посмотреть профиль Найти все сообщения от Safort
 
Регистрация: 23.12.2013
Сообщений: 1,856

Тут я вижу две ошибки:
1. Переменная result является числом, а ты пытаешься получить доступ к свойству result.innerHTML, которое отсутствует у числа.
2. Переменная price объявляется дважды.
Ответить с цитированием
  #8 (permalink)  
Старый 17.09.2014, 20:37
Аватар для Safort
Профессор
Отправить личное сообщение для Safort Посмотреть профиль Найти все сообщения от Safort
 
Регистрация: 23.12.2013
Сообщений: 1,856

Всё таки лучше подучить основы, а то от "с места в карьер" толку мало)

<input type="checkbox" onchange="calc()" value="Услуга"/>
  <span id="mon">3000</span> руб. Услуга
  <br/>
  <div>Стоимость: <span id="result">0</span> руб.</div>

  <script>
    
    function calc() {
      var mon = parseInt(document.getElementById("mon").innerHTML); // "1) считать значение span"
      var isChecked = document.querySelector('input').checked; //отмечен ли чекбокс
      var elResult = document.getElementById("result"); // куда будем записывать результат
      var result = parseInt(elResult.innerHTML); // общая сумма, так?
      var price;
      
      // "2)Проверить был ли нажат чекбокс."
      if (isChecked) {
        // "Если да, то к общей сумме прибавить значение из span."
        price = result + mon;
      } else {
        // "..Если нет - вычесть."
        price = result - mon;
      }
 
      // "4) Записать внизу страницы в специальное место"
      elResult.innerHTML = price;
 
    }

  </script>
Ответить с цитированием
  #9 (permalink)  
Старый 17.09.2014, 21:06
Интересующийся
Отправить личное сообщение для vetedde Посмотреть профиль Найти все сообщения от vetedde
 
Регистрация: 16.09.2014
Сообщений: 10

Согласна, что резковато и бестолково, но возникла жесткая необходимость. Сейчас нашла хорошую книгу стараюсь разобраться.
Большое Вам спасибо!
Ответить с цитированием
  #10 (permalink)  
Старый 17.09.2014, 21:20
Аватар для Safort
Профессор
Отправить личное сообщение для Safort Посмотреть профиль Найти все сообщения от Safort
 
Регистрация: 23.12.2013
Сообщений: 1,856

vetedde,
не за что. Обращайтесь)
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите , пожалуйста, вытащить текст из тега liana1979 Общие вопросы Javascript 2 15.02.2011 14:55