JavaScript를 통해 양식을 재설정 (지우기)하는 방법은 무엇입니까?

123

시도 $("#client.frm").reset();했지만 작동하지 않습니다. jQuery를 통해 양식을 재설정하는 방법은 무엇입니까?

javascript jquery

— 아쿠 즈마
소스

의 가능한 중복 stackoverflow.com/questions/680241/blank-out-a-form-with-jquery

— SVK

6

참고 : 지우기와 재설정은 서로 다른 두 가지입니다. 재설정 ( .reset())은 값을 HTML의 원래 값으로 되돌립니다. 이를 위해 아래의 Nick Craver의 솔루션을 참조하십시오. "지우기"는 일반적으로 값을 다시 공백 / 선택 취소 / 선택 취소로 설정하는 것을 의미합니다. MahmoudS 솔루션을 참조하십시오.

— Luke

258

form.reset() DOM 요소 메서드 (jQuery 개체에 없음)이므로 다음이 필요합니다.

$("#client.frm")[0].reset();
//faster version:
$("#client")[0].reset();

또는 jQuery없이 :

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

— 닉 크 레버
소스

4

제 두뇌는 확장되었습니다. "jQuery 객체는 하나 이상의 DOM 요소를 둘러싼 배열과 같은 래퍼입니다. jQuery 객체 대신 실제 DOM 요소에 대한 참조를 얻으려면 두 가지 옵션이 있습니다. 첫 번째 (및 가장 빠른) 방법은 배열 표기법을 사용하는 것입니다. $ ( "#foo") [0]; // document.getElementById ( "foo")와 동일합니다. 두 번째 방법은 .get () 함수를 사용하는 것입니다. $ ( "#foo ") .get (0); // 위와 동일하지만 속도가 느립니다." learn.jquery.com/using-jquery-core/faq/...

— 앤드류

다음 오류가 발생합니다. TypeError : document.getElementById (...). reset is not a function [자세히 알아보기]. FormValidate 플러그인을 양식에 사용합니다. ? 그 resetForm도하지 리셋 형태 = (어떤 제안 않습니다

— 오이겐 Konkov에게

Eugen, 여기는 Indiana Jones와 The Last Crusade처럼 믿음의 도약을해야하는 곳입니다. document.getElementById ( 'myform'). reset ()을 호출하면 해당 메서드가 존재하지 않는 것처럼 보이지만 실제로 양식을 지 웁니다. 전형적인 M $ 난독 화.

— 뉴 클리크

43

간단하게 다음을 수행 할 수 있습니다.

$("#client.frm").trigger('reset')

— 사용자 2057484
소스

1

A는 Trigger새로운 세계에 날을 제공합니다

— gonatee

17

Pure JS 솔루션 은 다음과 같습니다.

function clearForm(myFormElement) {

  var elements = myFormElement.elements;

  myFormElement.reset();

  for(i=0; i<elements.length; i++) {

  field_type = elements[i].type.toLowerCase();

  switch(field_type) {

    case "text":
    case "password":
    case "textarea":
          case "hidden":

      elements[i].value = "";
      break;

    case "radio":
    case "checkbox":
        if (elements[i].checked) {
          elements[i].checked = false;
      }
      break;

    case "select-one":
    case "select-multi":
                elements[i].selectedIndex = -1;
      break;

    default:
      break;
  }
    }
}

— 마흐무드 살레
소스

1

대략적으로 동등한 jQuery 플러그인 솔루션이 있습니다. stackoverflow.com/a/24496012/1766230 (당신의 selectedIndex = -1트릭을 사용했습니다 .)

— Luke

5

이 솔루션은 현재 작동하지 않습니다 (2016 년). 양식에 텍스트, 비밀번호 및 텍스트 영역 입력에 대한 기본값이있는 경우 elements [i] .value = ""대신 elements [i] .defaultValue = ""를 사용해야합니다.

— Andrew F.

var field_type = elements[i].type.toLowerCase();

— Martynas Januškauskas

@Andrew : 그것은 당신이 원하는 것에 달려 있습니다. 양식을 defaultValues 로 재설정 reset()하려면 양식 객체를 호출 하면됩니다. 여기서 코드 는 양식을 재설정하는 것이 아니라 지우는 것입니다.

— 수호자 1

4

, reset () 메서드는 기본값과 확인란 필드를 지우지 않으며 더 많은 문제가 있습니다.

완전히 재설정하려면 아래 링크를 확인하십시오-

http://www.javascript-coder.com/javascript-form/javascript-reset-form.htm

— 알 페시
소스

4

재설정 (지우기) 양식 throught Javascript& jQuery:

자바 스크립트 예 :

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

jQuery 예 :

참조 링크를 사용해 볼 수 있습니다.trigger()

$('#client.frm').trigger("reset");

— Gaurang P
소스

4

form.reset()양식의 일부 입력 태그에 속성이 있으면 기능 이 작동하지 않습니다.name='reset'

— 알렉스 보브 로프
소스

2

이 시도 :

$('#resetBtn').on('click', function(e){
    e.preventDefault();
    $("#myform")[0].reset.click();
}

— Hazem_M
소스

2

다음과 같이 양식을 지우십시오.

document.forms[0].reset();

그룹 내의 양식 요소를 간단히 지울 수 있습니다. 이것을 사용하여 forms[0].

— 나가라 주 부 팔라
소스

1

JavaScript 기능 사용 reset():

document.forms["frm_id"].reset();

— 펠릭스 바 구르
소스

1

다음을 사용할 수 있습니다.

$('[element]').trigger('reset')

— 저스트 러닝
소스

0

이 코드를 사용해보십시오. 귀하의 답변을위한 완벽한 솔루션입니다.

    <!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(":reset").css("background-color", "red");
});
</script>
</head>
<body>

<form action="">
  Name: <input type="text" name="user"><br>
  Password: <input type="password" name="password"><br>
  <button type="button">Useless Button</button>
  <input type="button" value="Another useless button"><br>
  <input type="reset" value="Reset">
  <input type="submit" value="Submit"><br>
</form>

</body>
</html>

— 재퍼 윌슨
소스

-1

onclick 함수를 사용하여 전체 양식을 지울 수 있습니다. 여기에 대한 코드가 있습니다.

 <button type="reset" value="reset" type="reset" class="btnreset" onclick="window.location.reload()">Reset</button>

window.location.reload () 함수는 페이지를 새로 고치고 모든 데이터가 지워집니다.

— 아르 준
소스