Отправка значения DIV в таблицу SQL при нажатии

Question

Отправка значения DIV в таблицу SQL при нажатии

У меня проблемы получение значения, присвоенного моим DIV. DIVs содержит ответы на опрос. (Я не могу использовать другие входы, такие как выбор, переключатель)

Ниже приведена форма:

<form id='Form01' action=''>
<div class="box" id='input01' onclick="submit_answer()" value='1'>YES</div>
<div class="box" id='input02' onclick="submit_answer()" value='2'>NO</
</form>

Ниже приведена функция для получения ответов:

function submit_answers(e) {
OPTION1: var answer = $(#input01).attr('value'); // RETURNS "1"OPTION2: var answer= $(this).attr('value');  // **RETURNS "Undefined"**
console.log(answer) ;
$.post('input_answers.php',{value:answer});
}

Я хотел бы вставить «1», если респондент нажимает «ДА», «2» для «НЕТ», но
var value01 = $(this).attr('value'); возвращает «НЕ УКАЗАНО.

Спасибо за помощь.

1

php sql survey

Решение

По вопросам рекламы [email protected]

Accepted Answer

попробуй вот так

$("#input01,#input02").click(function(){
var answer=  $(this).attr('value');

console.log(answer) ;
$.post('input_answers.php',{value:answer});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id='Form01' action=''>
<div class="box" id='input01'  value='1'>YES</div>
<div class="box" id='input02' value='2'>NO</div>
</form>

1

Другие решения

В вашем коде есть две проблемы:

У вас нет доступа к элементу HTML, который вызвал щелчок.
Значение — это атрибут входных элементов (а не div).

Чтобы исправить ваш JS правильно (и продолжайте использовать jQuery), попробуйте следующее:

function submit_answers(e) {
var value01 = $(this).attr('value');
$.post('input_answers.php',{value:value01});
}

Другие проблемы, которые я отмечаю с вашим кодом:

Есть несколько HTML с одинаковым идентификатором HTML. «id» должен быть уникальным идентификатором (рассмотрите возможность использования атрибута class, если вы используете его для стилизации или присоединения событий JavaScript)
Другой тип ввода будет лучше. Подумайте об использовании радиокнопок или выберите, так как это упрощает доступ
Использование HTML-атрибута onclick не одобряется большинством веб-разработчиков — рассмотрите возможность присоединения событий с помощью JavaScript (например, с помощью jQuery .on или vannila JS element.addEventListner ()).

РЕДАКТИРОВАТЬ: после обновленного вопроса
Поскольку JavaScript и HTML существенно изменились с момента моего первоначального ответа. Дальнейшие вопросы:

Функция, указанная в атрибуте onclick, и функция, записанная в разделе JS, не совпадают.
При определении ответа в варианте 1, кавычки нужны вокруг # input01 (в любом случае это неверно, так как всегда будет выбираться первый div)
Селектор может потребоваться e.target.

Проблемы, исправленные в (существенном) редакторе:

Дублирующиеся идентификаторы
Значение не является атрибутом JavaScript для не входных элементов

1

Источник