programing

자바스크립트를 통해 양식을 재설정(삭제)하는 방법은 무엇입니까?

telebox 2023. 8. 30. 21:34
반응형

자바스크립트를 통해 양식을 재설정(삭제)하는 방법은 무엇입니까?

난 시도했다.$("#client.frm").reset();하지만 효과가 없습니다.그렇다면 jQuery를 통해 양식을 재설정하는 방법은 무엇입니까?

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

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

또는 jQuery를 사용하지 않는 경우:

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

참고: 양식에 속성이 있는 필드가 포함되어 있으면 reset() 기능이 작동하지 않습니다.

name='reset'

간단히 수행할 수 있는 작업:

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

순수 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;
  }
    }
}

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

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

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

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

다음과 같이 양식을 지웁니다.

document.forms[0].reset();

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

폼 전체 재설정(지우기)Javascript&jQuery:

예제 Javascript:

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

jQuery 예제:

사용해 보십시오.trigger() 참조 링크

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

JavaScript 함수 사용reset():

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

사용해 보십시오.

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

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

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

이 코드를 사용해 보십시오.당신의 대답을 위한 완벽한 해결책.

    <!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>

이 간단한 방법을 사용하여 양식을 재설정합니다.

_("form_id").reset();

트리거 폼 재설정, 선택한 + 선택한 특성 제거(트리거 재설정으로 속성이 제거되지 않음) 및 빈 입력 값

$(document).on('click', 'button[data-reset-form]', function(e){
   e.preventDefault();
   $('form.my-form').trigger('reset')
   $('form.my-form').find('[checked]').removeAttr('checked')
   $('form.my-form').find('[selected]').removeAttr('selected')
   $('form.my-form').find('input').val('');
 })

온클릭 기능을 사용하여 전체 양식을 지울 수 있습니다.여기 그것에 대한 코드가 있습니다.

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

window.location.filename 함수는 당신의 페이지를 새로 고치고 모든 데이터를 지울 것입니다.

언급URL : https://stackoverflow.com/questions/3786694/how-to-reset-clear-form-through-javascript

반응형