Javascript.RU

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

Как сделать, что бы в переменную не записывались пустые значения?
Есть несколько блоков, которые перебираются циклом. В них содержатся инпуты и label, при нажатии на input, в консоль попадает input поле и label для него, в label нету атрибута value, а в input есть и в переменную я записываю значение атрибута value для input, но так как его нету в label, то в переменную попадает пустое значение.

И я решил сделать условие, что бы не попадало пустое значение, можно ли как то этот код улучшить?

<div class="options">
        <input type="hidden" value="18" class="questionId" name="questionId">
          <input type="radio" name="r-1" id="radio-1" value="1" title=""/>
          <label for="radio-1" class="false-answer">Да</label>
          <input type="radio" name="r-1" id="radio-2" value="2" title=""/>
          <label for="radio-2" class="true-answer">Нет</label>
        </div>

<div class="options">
            <input type="hidden" value="17" class="questionId" name="questionId">
          <input type="radio" name="r-2" id="radio-3" value="1" title=""/>
          <label for="radio-3" class="false-answer">Да</label>
          <input type="radio" name="r-2" id="radio-4" value="2" title=""/>
          <label for="radio-4" class="true-answer">Нет</label>
          <input type="radio" name="r-2" id="radio-5" value="3" title=""/>
          <label for="radio-5" class="false-answer">Движение разрешено только по обочине.</label>
        </div>

<div class="options">
        <input type="hidden" value="16" class="questionId" name="questionId">
          <input type="radio" name="r-3" id="radio-6" value="1" title=""/>
          <label for="radio-6" class="false-answer">Да</label>
          <input type="radio" name="r-3" id="radio-7" value="2" title=""/>
          <label for="radio-7" class="true-answer">Нет</label>
        </div>


var ans = document.querySelectorAll('.options');
    
    ans.forEach(function (element, i) {

        ans[i].addEventListener('click', function (e) {
         var inputs = e.target.closest('.options');
         var idQuestion = inputs.getElementsByClassName("questionId")[0].value;
            
        var answer = '';
           
           if(e.target.hasAttribute('value')) {
             answer = e.target.value;
           }

            else {
                return; // что бы не попадало пустое значение
            }

        console.log(answer);
        
 })

    })
Ответить с цитированием
  #2 (permalink)  
Старый 14.09.2019, 13:48
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

И зачем такие сложности.

var ans = document.querySelectorAll('.options');
     
ans.forEach(function (element) {
    element.addEventListener('change', function (e) {
        console.log(e.target) //это та радио кнопка, которую выбрали и значение которой является значением группы
         
    }) 
})
Ответить с цитированием
  #3 (permalink)  
Старый 14.09.2019, 13:51
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

DivMan,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<div class="options">
        <input type="hidden" value="18" class="questionId" name="questionId">
          <input type="radio" name="r-1" id="radio-1" value="1" title=""/>
          <label for="radio-1" class="false-answer">Да</label>
          <input type="radio" name="r-1" id="radio-2" value="2" title=""/>
          <label for="radio-2" class="true-answer">Нет</label>
        </div>

<div class="options">
            <input type="hidden" value="17" class="questionId" name="questionId">
          <input type="radio" name="r-2" id="radio-3" value="1" title=""/>
          <label for="radio-3" class="false-answer">Да</label>
          <input type="radio" name="r-2" id="radio-4" value="2" title=""/>
          <label for="radio-4" class="true-answer">Нет</label>
          <input type="radio" name="r-2" id="radio-5" value="3" title=""/>
          <label for="radio-5" class="false-answer">Движение разрешено только по обочине.</label>
        </div>

<div class="options">
        <input type="hidden" value="16" class="questionId" name="questionId">
          <input type="radio" name="r-3" id="radio-6" value="1" title=""/>
          <label for="radio-6" class="false-answer">Да</label>
          <input type="radio" name="r-3" id="radio-7" value="2" title=""/>
          <label for="radio-7" class="true-answer">Нет</label>
        </div>
  <script>
    var ans = document.querySelectorAll('.options');
    ans.forEach(function (element, i) {
        var idQuestion = element.querySelector(".questionId").value;
        element.addEventListener('change', function (e) {
        var answer = e.target.value;
        console.log(idQuestion, answer)
         })
    })
  </script>
</body>
</html>

Последний раз редактировалось рони, 14.09.2019 в 13:57.
Ответить с цитированием
  #4 (permalink)  
Старый 14.09.2019, 13:56
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

Сообщение от laimas
'change'
код выше исправил
Ответить с цитированием
  #5 (permalink)  
Старый 14.09.2019, 14:09
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

рони,
а зачем так element.querySelector(".questionId").value;, если достаточно e.target.value;?
Ответить с цитированием
  #6 (permalink)  
Старый 14.09.2019, 15:00
Профессор
Отправить личное сообщение для DivMan Посмотреть профиль Найти все сообщения от DivMan
 
Регистрация: 08.03.2016
Сообщений: 429

Спасибо
Ответить с цитированием
  #7 (permalink)  
Старый 14.09.2019, 15:02
Профессор
Отправить личное сообщение для DivMan Посмотреть профиль Найти все сообщения от DivMan
 
Регистрация: 08.03.2016
Сообщений: 429

Сообщение от laimas Посмотреть сообщение
рони,
а зачем так element.querySelector(".questionId").value;, если достаточно e.target.value;?
Это для скрытого поля
Ответить с цитированием
  #8 (permalink)  
Старый 14.09.2019, 15:28
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от DivMan
Это для скрытого поля
А зачем еще и скрытые поля?
Ответить с цитированием
  #9 (permalink)  
Старый 14.09.2019, 15:47
Профессор
Отправить личное сообщение для DivMan Посмотреть профиль Найти все сообщения от DivMan
 
Регистрация: 08.03.2016
Сообщений: 429

Сообщение от laimas Посмотреть сообщение
А зачем еще и скрытые поля?
Что бы для AJAX передать id поста
Ответить с цитированием
  #10 (permalink)  
Старый 14.09.2019, 15:51
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от DivMan
Что бы для AJAX передать id поста
У вас что вне формы это все?
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как я хотел стать программистом (история из моей жизни) prostofrontend Оффтопик 5 11.01.2017 00:55
Как сделать переменную не изменяемой? 9xakep Общие вопросы Javascript 6 24.04.2012 20:59
Как сделать что бы пока курсор находится на блоке что-либо происходило? Cron532 Общие вопросы Javascript 2 17.03.2012 12:03
Как сделать локальную переменную глобальной?? Дмитрий Общие вопросы Javascript 8 02.11.2010 03:33
Как сделать так что бы ссылки мигали разными цветами? woo_hoo Общие вопросы Javascript 2 19.03.2010 11:28