Textarea字段在提交时返回空

我有一个简单的问题作为表格的一部分.如果用户回答"是",则可以选择输入更多详细信息.

当用户回答"是"并在其中输入更多详细信息时textarea,在提交时它返回空.我无法弄清楚为什么.我觉得这可能是我想念的小事.

示例:https://jsfiddle.net/sq8awxyk/

HTML

  

    Is this the correct name?
    Yes
    No
  
  

jQuery的

// Name Input
var nameFormLimit = 20;
var nameInput = 'input[name=name-choice]';
var nameInputValue = $('input[name=name-choice]:checked').val();
var response;

$(nameInput).on('click', function(e) {
  var nameInputValue = $('input[name=name-choice]:checked').val();
  if (nameInputValue === 'yes') {
    var nameDiv = document.getElementById('name-form');
    nameDiv.innerHTML = 'Please type the correct name: ' +
      ' 
';
    $('#textarea_feedback').html(nameFormLimit + ' characters remaining');
    $('#textarea').keyup(function() {
      var text_length = $('#textarea').val().length;
      var text_remaining = nameFormLimit - text_length;
      $('#textarea_feedback').html(text_remaining + ' characters remaining');
    });
    response = $('#textarea').val();
  } else if (nameInputValue === 'no') {
    response = nameInputValue;
  }
});

$('#submit').on('click', function(e) {
  alert(response);
  e.preventDefault();
});

Shyju.. 6

您需要再次读取文本区域内容,并response在使用之前将其设置为submit事件中的变量.

var response="";
$('#submit').on('click', function(e) {
  response = $('#textarea').val();
  alert(response);
  e.preventDefault();
});

这是一个有效的jsFiddle

或者您需要在文本区域的keyup事件上设置响应变量值.

$(document).on("keyup","#textarea",function() {
  var text_length = $('#textarea').val().length;
  var text_remaining = nameFormLimit - text_length;
  $('#textarea_feedback').html(text_remaining + ' characters remaining');
  response = $('#textarea').val();
});

通过此更改,您无需在提交事件中读取它.

这是一个工作样本.

您需要再次读取文本区域内容,并response在使用之前将其设置为submit事件中的变量.

var response="";
$('#submit').on('click', function(e) {
  response = $('#textarea').val();
  alert(response);
  e.preventDefault();
});

这是一个有效的jsFiddle

或者您需要在文本区域的keyup事件上设置响应变量值.

$(document).on("keyup","#textarea",function() {
  var text_length = $('#textarea').val().length;
  var text_remaining = nameFormLimit - text_length;
  $('#textarea_feedback').html(text_remaining + ' characters remaining');
  response = $('#textarea').val();
});

通过此更改,您无需在提交事件中读取它.

这是一个工作样本.