복붙노트

[JQUERY] jQuery로 클리어 폼 필드

JQUERY

jQuery로 클리어 폼 필드

해결법


  1. 1.

    $(".reset").click(function() {
        $(this).closest('form').find("input[type=text], textarea").val("");
    });
    

  2. 2.1.6 jQuery를 들어 :

    1.6 jQuery를 들어 :

    $(':input','#myform')
      .not(':button, :submit, :reset, :hidden')
      .val('')
      .prop('checked', false)
      .prop('selected', false);
    

    jQuery를 <1.6의 경우 :

    $(':input','#myform')
      .not(':button, :submit, :reset, :hidden')
      .val('')
      .removeAttr('checked')
      .removeAttr('selected');
    

    이 게시물을 참조하십시오 : jQuery로 다단계 양식을 재설정

    또는

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

    jQuery를 알 수 있듯이 :


  3. 3.이 모든 이유는 사용할 수 없습니다?

    이 모든 이유는 사용할 수 없습니다?

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

  4. 4.이 폼 입력 필드가 비어 있지 않은 기본값이 경우를 처리하지 않습니다.

    이 폼 입력 필드가 비어 있지 않은 기본값이 경우를 처리하지 않습니다.

    SHOULD 작업 비슷해

    $('yourdiv').find('form')[0].reset();
    

  5. 5.당신이 빈 값으로 선택기 및 메이크업 값을 사용하는 경우, 그것은 양식을 재설정하지 않습니다 모든 필드가 비어 만들고있다. 재설정은 서버 측에서 폼의 Load 후 사용자로부터 어떠한 편집 작업 전과 같은 형태를 만드는 것입니다. 이 이름이 "이름"을 입력하고 해당 사용자 이름이 서버 측에서 미리 입력 된 경우,이 페이지에 솔루션의 대부분은 사용자의 변경 전에 얼마나 값으로 재설정하지, 입력에서 그 값을 삭제합니다. 양식을 다시 설정해야하는 경우, 이것을 사용 :

    당신이 빈 값으로 선택기 및 메이크업 값을 사용하는 경우, 그것은 양식을 재설정하지 않습니다 모든 필드가 비어 만들고있다. 재설정은 서버 측에서 폼의 Load 후 사용자로부터 어떠한 편집 작업 전과 같은 형태를 만드는 것입니다. 이 이름이 "이름"을 입력하고 해당 사용자 이름이 서버 측에서 미리 입력 된 경우,이 페이지에 솔루션의 대부분은 사용자의 변경 전에 얼마나 값으로 재설정하지, 입력에서 그 값을 삭제합니다. 양식을 다시 설정해야하는 경우, 이것을 사용 :

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

    당신은 어떤 값으로 모든 입력 양식을 재설정하지만 채울 필요가없는 경우, 예를 빈 값을 위해, 당신은 다른 의견에서 솔루션의 대부분을 사용할 수 있습니다.


  6. 6.단순하지만 마법처럼 작동합니다.

    단순하지만 마법처럼 작동합니다.

    $("#form").trigger('reset'); //jquery
    document.getElementById("myform").reset(); //native JS
    

  7. 7.사람이 여전히이 스레드를 읽고, 여기에 있지 jQuery를 사용하여 간단한 해결하지만, 일반 자바 스크립트입니다. 당신의 입력 필드가 양식 내에있는 경우, 간단한 자바 스크립트 리셋 명령이 있습니다 :

    사람이 여전히이 스레드를 읽고, 여기에 있지 jQuery를 사용하여 간단한 해결하지만, 일반 자바 스크립트입니다. 당신의 입력 필드가 양식 내에있는 경우, 간단한 자바 스크립트 리셋 명령이 있습니다 :

    document.getElementById("myform").reset();
    

    여기에 대한 자세한 : http://www.w3schools.com/jsref/met_form_reset.asp

    건배!


  8. 8.

    $('form[name="myform"]')[0].reset();
    

  9. 9.왜 전혀 자바 스크립트로 수행해야합니까?

    왜 전혀 자바 스크립트로 수행해야합니까?

    <form>
        <!-- snip -->
        <input type="reset" value="Reset"/>
    </form>
    

    http://www.w3.org/TR/html5/the-input-element.html#attr-input-type-keywords

    여기에 다음 jQuery를, 함께 할 수있는 방법이다 :

    $('.reset').on('click', function() {
        $(this).closest('form').find('input[type=text], textarea').val('');
    });
    

  10. 10.당신이 상자의 유형에 관계없이 모든 입력을 비우려면 그것은 의한 분 걸음

    당신이 상자의 유형에 관계없이 모든 입력을 비우려면 그것은 의한 분 걸음

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

  11. 11.나는 다시 형태에 쉬운 트릭을 가지고

    나는 다시 형태에 쉬운 트릭을 가지고

    jQuery("#review-form")[0].reset();
    

    또는

    $("#review-form").get().reset();
    

  12. 12.자바 스크립트를 사용하면 간단하게이 구문에서 getElementById ( "당신의 형태-ID")와 함께 할 수 있습니다) (리셋합니다.;

    자바 스크립트를 사용하면 간단하게이 구문에서 getElementById ( "당신의 형태-ID")와 함께 할 수 있습니다) (리셋합니다.;

    당신이이 방법 $ 리셋 함수를 호출하여 jQuery를 사용할 수 있습니다 ( '# 당신의 형태-ID') [0] .reset ();

    [0]를 잊지 않도록 기억. 다음과 같은 오류 경우를 얻을 것이다

    JQuery와도 사용할 수있는 이벤트를 제공합니다

    나는 시도하고 작동합니다.

    참고 :이 방법은 페이지로드에있는 서버에서 초기 값 설정에 양식을 다시 설정 통지에 그것의 중요한. 당신이 임의의 변화를 한 전에 입력 값 '설정 값'에 설정된 경우 재설정 메서드가 호출 된 후이 수단은, 필드는 같은 값으로 재설정됩니다.

    희망이 도움이


  13. 13.

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

    어디 editPOIForm는 폼의 id 속성입니다.


  14. 14.당신은 document.getElementById를 ( "MYID")를 사용 해달라고 왜 다시 ().; ? 이것은 간단하고 예쁜

    당신은 document.getElementById를 ( "MYID")를 사용 해달라고 왜 다시 ().; ? 이것은 간단하고 예쁜


  15. 15.테스트 및 코드를 확인 :

    테스트 및 코드를 확인 :

      $( document ).ready(function() {
        $('#messageForm').submit(function(e){
           e.preventDefault();
        });
        $('#send').click(function(e){
          $("#messageForm")[0].reset();
        });
      });
    

    자바 스크립트는 .ready $ (문서)에 포함되어야하며, 그것은 당신의 논리를해야합니다.


  16. 16.가장 쉽고 가장 좋은 방법가 - $ ( "# 폼") [0] .reset ();

    가장 쉽고 가장 좋은 방법가 - $ ( "# 폼") [0] .reset ();

    여기에 사용하지 마십시오 - $ (이) [0] .reset ();


  17. 17.우리는 당신이 청소에 사용되는 방식, 즉 'All'.Remaining 필드, 즉 텍스트 box.This를 비우는 재설정해야합니다 특정 값으로 재설정됩니다 평균 시간 드롭 다운 상자에서 필드와 ACCOUNTTYPE 제외를 취소하려는 경우 가정 해 봅시다 우리의 요구 사항으로 특정 분야.

    우리는 당신이 청소에 사용되는 방식, 즉 'All'.Remaining 필드, 즉 텍스트 box.This를 비우는 재설정해야합니다 특정 값으로 재설정됩니다 평균 시간 드롭 다운 상자에서 필드와 ACCOUNTTYPE 제외를 취소하려는 경우 가정 해 봅시다 우리의 요구 사항으로 특정 분야.

     $(':input').not('#accountType').each( function() {
    
        if(this.type=='text' || this.type=='textarea'){
                 this.value = '';
           }
        else if(this.type=='radio' || this.type=='checkbox'){
             this.checked=false;
          }
             else if(this.type=='select-one' || this.type=='select-multiple'){
                  this.value ='All';
         }
     });
    

  18. 18.나는 이것을 사용

    나는 이것을 사용

    $(".reset").click(function() {
      $('input[type=text]').each(function(){
         $(this).val('');
      });
    });
    

    그리고 여기 내 버튼은 다음과 같습니다

    <a href="#" class="reset">
      <i class="fa fa-close"></i>
         Reset
    </a>
    

  19. 19.당신이 jQuery를하여 전화 일반 리셋 기능을 원하는 경우이 코드를 사용

    당신이 jQuery를하여 전화 일반 리셋 기능을 원하는 경우이 코드를 사용

    setTimeout("reset_form()",2000);
    

    그리고 문서 준비에이 기능 아웃 사이트 jQuery를 쓰기

    <script>
    function reset_form()
    {
        var fm=document.getElementById('form1');
        fm.reset();
    }
    </script>
    

  20. 20.라디오 : 당신의 일부는 라디오 등은 "확인"기본적으로 취소 된 상태인지 불평 한 상태 ... 당신이해야 할 추가입니다 확인란 선택기를이 아니요과 문제는 해결된다.

    라디오 : 당신의 일부는 라디오 등은 "확인"기본적으로 취소 된 상태인지 불평 한 상태 ... 당신이해야 할 추가입니다 확인란 선택기를이 아니요과 문제는 해결된다.

    당신이 직장에 다른 모든 리셋 기능을 얻을 수없는 경우,이는 것이다.


  21. 21.

    @using (Ajax.BeginForm("Create", "AcceptanceQualityDefect", new AjaxOptions()
    {
        OnSuccess = "ClearInput",
        HttpMethod = "Post",
        UpdateTargetId = "defect-list",
        InsertionMode = InsertionMode.Replace
    }, new { @id = "frmID" })) 
    

  22. 22.다음 코드는 모든 양식을 취소하고 그것의 필드는 비어 있습니다. 이 페이지가 하나 개 이상의 형태를 갖는 경우에만 특정 양식을 취소 할 경우 양식의 ID 또는 클래스를 언급 해주십시오

    다음 코드는 모든 양식을 취소하고 그것의 필드는 비어 있습니다. 이 페이지가 하나 개 이상의 형태를 갖는 경우에만 특정 양식을 취소 할 경우 양식의 ID 또는 클래스를 언급 해주십시오

    $("body").find('form').find('input,  textarea').val('');
    

  23. 23.jQuery의 .trigger () 및 기본 Javascript를의 .reset의 조합을 사용하여 () 모든 양식 요소는 빈 상태로 재설정 할 수 있습니다.

    jQuery의 .trigger () 및 기본 Javascript를의 .reset의 조합을 사용하여 () 모든 양식 요소는 빈 상태로 재설정 할 수 있습니다.

    $(".reset").click(function(){
        $("#<form_id>").trigger("reset");
    });
    

    재설정 형태의 ID로 교체합니다.


  24. 24.내가 accountType..Use 제외한 모든 필드를 다음을 지우려면

    내가 accountType..Use 제외한 모든 필드를 다음을 지우려면

    $q(':input','#myform').not('#accountType').val('').removeAttr('checked').removeAttr('selected');
    

  25. 25.여기 및 관련 SO 질문에 표시되는 코드는 불완전 보인다.

    여기 및 관련 SO 질문에 표시되는 코드는 불완전 보인다.

    HTML에서 원래 값을 설정 양식 수단을 재설정, 나는 위의 코드를 기반으로하고 있던 작은 프로젝트를 위해이 함께 넣어 너무 :

                $(':input', this)
                    .not(':button, :submit, :reset, :hidden')
                    .each(function(i,e) {
                        $(e).val($(e).attr('value') || '')
                            .prop('checked',  false)
                            .prop('selected', false)
                    })
    
                $('option[selected]', this).prop('selected', true)
                $('input[checked]',   this).prop('checked',  true)
                $('textarea',         this).each(function(i,e) { $(e).val($(e).html()) })
    

    난 아무것도 누락 알려 주시기 또는 아무것도을 향상시킬 수있다하십시오.


  26. 26.페이지 IHttpHandler를 요구 처리 (CAPTCHA)를 포함 웹 사용자 컨트롤에 대한 호출을 포함하는 간단한 경우에 상기 저작물 없음. (이미지 처리 용) requsrt를 전송 한 후 아래 코드는 everythings가 제대로 작동합니다 (HttpHandler를 요청을 보내기 전에) 폼의 필드를 취소하지 않습니다.

    페이지 IHttpHandler를 요구 처리 (CAPTCHA)를 포함 웹 사용자 컨트롤에 대한 호출을 포함하는 간단한 경우에 상기 저작물 없음. (이미지 처리 용) requsrt를 전송 한 후 아래 코드는 everythings가 제대로 작동합니다 (HttpHandler를 요청을 보내기 전에) 폼의 필드를 취소하지 않습니다.

    <input type="reset"  value="ClearAllFields" onclick="ClearContact()" />
    
     <script type="text/javascript">
           function ClearContact() {
               ("form :text").val("");
           }
        </script>
    

  27. 27.나는 보편적 인 jQuery 플러그인을 작성했습니다 :

    나는 보편적 인 jQuery 플러그인을 작성했습니다 :

    / ** * 임의의 리셋 입력 필드 또는 양식 * / $ .fn.uReset = 함수 () { ( '형태 : 입력')를 돌려 각 this.filter (함수 () {. VAR 입력 $ (이) =; 양식을 재설정 //. 경우 (input.is ( '양식')) { 입력 [0] .reset (); 반환; } 모든 양식 필드를 재설정 //. 경우 ((input.is ': 라디오, : 체크 박스')) { input.prop ( '선택'this.defaultChecked); } 다른 (input.is가 ( '선택')) {경우 input.find ( '옵션'). 각 (함수 () { $ (이) .prop ( '선택', this.defaultSelected); }); } 다른 경우 (this.defaultValue) { input.val (this.defaultValue); } 다른 { 을 console.log ( '값을 기본값으로 재설정 할 수 없습니다'); } }); }; () {(기능 $ // 테스트 jQuery 플러그인. $ ( '버튼'). 클릭 (함수 (전자) { e.preventDefault (); VAR 버튼 = $ (이) inputType button.val = (), 형태 button.closest = ( '형태'); 경우 (inputType === '형태') { form.uReset () } 다른 { $ ( '입력 [TYPE ='+ inputType + ','+ inputType 양식) .uReset (); } }); }); <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">

    양식


    1 장
    <= "확인"입력 / 타입 = "체크 박스"NAME = "색상"값 = "1"체크> (디폴트 선택) 2 장
    3 장 <= "확인"입력 / 타입 = "체크 박스"NAME = "색상"값 = "3"체크>

    (디폴트 선택) <선택 이름 = "시간">
    <옵션 값 = "15"> 15 <옵션은 "선택"을 선택 = 값 = "30"> 30 <옵션 값 = "45"> 45 <선택 />

    R 1
    R 2 (기본 체크)
    R 3

    <텍스트 영역> 기본 텍스트

    을 다시 시도하십시오 양식 값과 플레이 <버튼형 = "버튼"값 = "텍스트"> 리셋 텍스트 입력 <버튼형 = "버튼"값 = "체크 박스"> 초기화 체크 박스 선택 초기화 <버튼 타입 = "버튼"값 = "선택"> <버튼형 = "버튼"값 = "무선"> 리셋 라디오 <버튼형 = "버튼"값 = "텍스트 영역"> 텍스트 영역 재설정 <버튼형 = "버튼"값 = "폼"> 폼 초기화


  28. 28.

    $(document).ready(function() {
        $('#reset').click(function() {
        $('#compose_form').find("input[type=text] , textarea ").each(function() {
        $(this).val('');
       });
      });
    });  
    

  29. 29.다음과 같이 숨겨진 리셋 버튼 추가

    다음과 같이 숨겨진 리셋 버튼 추가

    <input id="resetBtn" type="reset" value="reset" style="display:none" />
    // Call reset buttons click event
    // Similar to ClearInputs('resetBtn');
    function ClearInputs(btnSelector) {
         var btn = $("#" + btnSelector);
         btn.click();
    }
    

  30. 30.$ ( '양식'). ((기능 제출) {

    $ ( '양식'). ((기능 제출) {

    var el = $(this);
    
    $('<button type="reset" style="display:none; "></button>')
        .appendTo(el)
        .click()
        .remove()
    ;
    
    return false;
    

    });

  31. from https://stackoverflow.com/questions/6364289/clear-form-fields-with-jquery by cc-by-sa and MIT license