양식의 모든 필드를 지우는 jQuery/Javascript 함수

양식의 모든 필드를 지우는 jQuery/Javascript 함수

이 질문에는 이미 다음과 같은 답변이 있습니다.

jQuery를 사용하여 다단계 양식 재설정 (31개 답변)

닫힘10년 전에.

양식을 제출한 후 양식의 모든 필드를 클리어 해주는 jQuery 기능을 찾고 있습니다.

보여줄 HTML 코드가 없어서 일반적인 것이 필요합니다.

도와주실 수 있겠어요?

감사합니다!

참고: 이 답변은 필드를 지우는 것이 아니라 양식 필드를 재설정하는 것과 관련이 있습니다. 업데이트를 참조하십시오.

자바스크립트의 네이티브 메소드를 사용하여 전체 폼을 기본 상태로 재설정할 수 있습니다.

Ryan이 제공한 예제:

$('#myForm')[0].reset();

참고: 다음과 같은 특정 필드는 재설정되지 않을 수 있습니다.type="hidden".

갱신하다

Ilya Doroshin이 언급한 바와 같이, jQuery's를 사용하면 동일한 작업을 수행할 수 있습니다.

$('#myForm').trigger("reset");

갱신하다

양식을 기본 상태로 재설정하는 것 이상의 작업을 수행해야 하는 경우 jQuery를 사용하여 다단계 양식 재설정에 대한 답변을 검토해야 합니다.

양식을 재설정하려면(양식을 지우지는 않지만) 트리거만 하면 됩니다.reset이벤트:

$('#form').trigger("reset");

양식을 지우려면 다른 답변을 참조하십시오.

비슷한 것.$("#formId").reset()기본값이 다음과 같이 설정된 폼 항목을 지우지 않습니다."". 이 문제가 발생할 수 있는 한 가지 방법은 이전 양식 제출입니다. 양식을 제출한 후reset()이전에 제출된 값을 "수정"할 것이며, 그렇지 않을 가능성이 있습니다."".

페이지의 모든 양식을 지우는 한 가지 옵션은 다음과 같은 함수를 호출하여 간단히 다음과 같이 실행하는 것입니다.clearForms():

function clearForms()
{
    $(':input').not(':button, :submit, :reset, :hidden, :checkbox, :radio').val('');
    $(':checkbox, :radio').prop('checked', false);
}

특정 양식을 재설정하려면 다음과 같이 함수를 수정하고 다음과 같이 부릅니다.clearForm($("#formId")):

function clearForm($form)
{
    $form.find(':input').not(':button, :submit, :reset, :hidden, :checkbox, :radio').val('');
    $form.find(':checkbox, :radio').prop('checked', false);
}

처음 이 페이지에 왔을 때는 양식 기본값이 변경되고 모든 입력 항목을 지울 수 있는 솔루션이 필요했습니다.

이 문제는 해결되지 않습니다.placeholder본문.

셋 더val""로

function clear_form_elements(ele) {

        $(ele).find(':input').each(function() {
            switch(this.type) {
                case 'password':
                case 'select-multiple':
                case 'select-one':
                case 'text':
                case 'textarea':
                    $(this).val('');
                    break;
                case 'checkbox':
                case 'radio':
                    this.checked = false;
            }
        });

    }

<input onclick="clear_form_elements(this.form)" type="button" value="Clear All" />  
<input onclick="clear_form_elements('#example_1')" type="button" value="Clear Section 1" />
<input onclick="clear_form_elements('#example_2')" type="button" value="Clear Section 2" />
<input onclick="clear_form_elements('#example_3')" type="button" value="Clear Section 3" />

다음과 같은 것을 시도해 볼 수도 있습니다.

  function clearForm(form) {

    // iterate over all of the inputs for the form

    // element that was passed in

    $(':input', form).each(function() {

      var type = this.type;

      var tag = this.tagName.toLowerCase(); // normalize case

      // it's ok to reset the value attr of text inputs,

      // password inputs, and textareas

      if (type == 'text' || type == 'password' || tag == 'textarea')

        this.value = "";

      // checkboxes and radios need to have their checked state cleared

      // but should *not* have their 'value' changed

      else if (type == 'checkbox' || type == 'radio')

        this.checked = false;

      // select elements need to have their 'selectedIndex' property set to -1

      // (this works for both single and multiple select elements)

      else if (tag == 'select')

        this.selectedIndex = -1;

    });

  };

여기 및 여기에 대한 자세한 정보

    <form id="form" method="post" action="action.php">
      <input type="text" class="removeLater" name="name" /> Username<br/>
      <input type="text" class="removeLater" name="pass" /> Password<br/>
      <input type="text" class="removeLater" name="pass2" /> Password again<br/>
    </form>
    <script>
$(function(){
    $("form").submit(function(e){
         //do anything you want
         //& remove values
         $(".removeLater").val('');
    }

});
</script>

간단히 사용할 수 있습니다.reset단추형.

<input type="text" />
<input type="reset" />

jsfiddle

편집: 기억하세요.reset버튼, 원래 값에 대한 양식을 재설정하여 필드에 값이 설정되어 있는 경우<input type="text" value="Name" />인쇄 후에reset필드는 사용자가 삽입한 값을 재설정하고 이 예에서 "이름"이라는 단어로 돌아갑니다.

참조 : http://api.jquery.com/reset-selector/

다음 솔루션을 사용합니다.

1) Jquery Validation 플러그인 설정

2) 그러면:

$('your form's selector').resetForm();

function reset_form() {
 $('#ID_OF_FORM').each (function(){  
    this.reset();
 }); 
}

트리거 아이디어는 똑똑했지만, 저는 jQuery 방식으로 하고 싶었습니다. 그래서 여기 당신이 계속해서 체인을 할 수 있는 작은 기능이 있습니다.

$.fn.resetForm = function() {
    return this.each(function(){
        this.reset();
    });
}

그럼 그냥 이렇게 불러요.

$('#divwithformin form').resetForm();

아니면

$('form').resetForm();

물론 아직도 체인에서 사용할 수 있습니다.

$('form.register').resetForm().find('input[type="submit"]').attr('disabled','disabled')

뭔가 효과가 있을까요?

마감 시 JQuery Clear 양식

HTML

<form id="contactform"></form>

자바스크립트

 var $contactform = $('#contactform')
    $($contactform).find("input[type=text] , textarea ").each(function(){
                $(this).val('');            
    });

모든 필드를 지우는 단순 및 단축 기능

언급URL : https://stackoverflow.com/questions/6653556/jquery-javascript-function-to-clear-all-the-fields-of-a-form