양식 제출 후 Textarea 값이 동일하게 유지됨

Question

이전 문제점이 수정되었으므로 양식을 제출 한 후 텍스트 영역의 입력을 재설정하는 방법을 알아야합니다. jsFiddle은 다음과 같습니다. http://jsfiddle.net/rz4pnumy/

HTML의 양식을 변경해야합니까?

<form id="form1" method="GET"> 

(내가 같은 페이지에 단락을 만들기 위해 텍스트 영역에 입력을 제출하고 내가 jQuery를 사용하여 만든 변수를 사용하도록 사용하고 PHP 파일 또는 다른 어떤로하지 않는 양식) 또는 JS에서 뭔가?

$(document).ready(function() { 

    $('#form1').on('submit', function (event) { 

    // If the form validation returns false, block the form from submitting by 
    // preventing the event's default behaviour from executing. 
    if (!validate()) { 
     event.preventDefault(); 
    } 

    if(validate()) { 
     var adjective1 = $('#adjective1').val(); 
     var adjective2 = $('#adjective2').val(); 
     var pluralnoun = $('#plural-noun').val(); 
     var verb1 = $('#verb1').val(); 
     var edibleobject = $('#edible-object').val(); 
     var monster1 = $('#monster1').val(); 
     var adjective3 = $('#adjective3').val(); 
     var monster2 = $('#monster2').val(); 
     var verb2 = $('#verb2').val(); 

     $('body').append(
     '<div id="para">' + 
      '<p>Rain was still lashing the windows, which were now ' + adjective1 +', but inside all looked bright and cheerful. ' + 
      'The firelight glowed over the countless ' + adjective2 + '' + pluralnoun + ' where people sat ' + verb1 + ', talking, ' + 
      'doing homework or, in the case of Fred and George Weasley, trying to find out what would happen if you fed a ' + edibleobject +' to a ' + monster1 + '.' + 
      'Fred had "rescued" the ' + adjective3 + ', fire-dwelling ' + monster2 + ' from a Care of Magical Creatures class and it was now ' + verb2 + ' gently ' + 
      'on a table surrounded by a knot of curious people. </p>' + 
     '</div>' 
     ); 
    } 
}); 

function validate() { 

    var success = true; 

    $('.input').each(function(i, item) { 
     if ($(item).val() === "") 
     { 
     console.log("Missing textarea input"); 
     success = false; 
     $(item).attr("style","border:1px solid red;"); 
     //note it will overwrite your element style in all Input class 
     } 
     else 
     { 
     $(item).removeAttr('style') 
     // to remove border 
    } 
    }); 

    return success; 
} 
}); 

제출 키를 누르면 내용이 비워지고 완료된 단락 만 볼 수 있습니다.

Answer 1

validate가 통과하는지 여부에 관계없이 기본 이벤트 처리기가 실행되지 않도록해야하므로 event.preventDefault() 호출을 통해 if 문을 제거해야합니다. preventDefault는에서 페이지를 제출하고 다시로드하지 못하게하는 함수입니다.

또한 Fiddle은 jQuery (no-library로 설정 됨)로 설정되지 않았으므로 테스트 중에 문제가 발생할 수도 있습니다.

의 예를 들어 편집 내가 얘기 해요 :

나는 PHP를 사용하여 텍스트 영역의 GET 값에 변수를 설정하고 그 변수에 텍스트 영역의 값을 설정합니다

$('#form1').on('submit', function (event) { 

    // block the form from submitting by 
    // preventing the event's default behaviour from executing. 
    event.preventDefault(); 

    if(validate()) { 
     var adjective1 = $('#adjective1').val(); 
     var adjective2 = $('#adjective2').val(); 
     var pluralnoun = $('#plural-noun').val(); 
     ... etc ... 

Answer 2