Pole Textarea wraca po wysłaniu

Question

Mam proste pytanie jako część formularza. Jeśli użytkownik odpowie "Tak", ma możliwość wprowadzenia dalszych szczegółów.

Gdy użytkownik odpowie "Tak" i wprowadza więcej szczegółów w textarea, po przesłaniu zwraca pusty. Nie rozumiem dlaczego. Czuję, że to prawdopodobnie coś małego, czego mi brakuje.

przykład: https://jsfiddle.net/sq8awxyk/

HTML

<form> 
    <div id="name-form"> 
    <label for="name"><strong>Is this the correct name?</strong></label> 
    <input type="radio" value="yes" name="name-choice" />Yes 
    <input type="radio" value="no" name="name-choice" />No 
    </div> 
    <input id="submit" type="submit" value="submit" /> 
</form> 

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 = '<label for="name"><strong>Please type the correct name:</strong></label> ' + 
     '<textarea id="textarea" name="name" rows="1" maxlength="' + nameFormLimit + '"></textarea> <div id="textarea_feedback"></div>'; 
    $('#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(); 
}); 

Answer 1

Trzeba ponownie odczytać zawartość pola tekstowego i ustawić go do zmiennej response w przedkładać zdarzenie przed jego użyciem.

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

Here jest jsFiddle pracy

lub musisz ustawić wartość zmiennej odpowiedzi na keyup przypadku obszaru tekstu.

$(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(); 
}); 

Po wprowadzeniu tej zmiany nie trzeba czytać jej w zgłoszeniu.

Here to próbka robocza do tego.