jquery에서 재설정 메소드를 사용하여 양식 내용을 재설정하는 방법

프론트엔드 개발에서 폼은 필수 요소이며, 폼에서는 폼 내용을 지우거나 재설정해야 하는 경우가 가끔 있습니다. jQuery는 이러한 요구 사항을 충족하기 위해 재설정() 형식 메서드를 제공합니다.

jQuery 폼 재설정() 메서드란 무엇입니까?

jQuery 폼 재설정() 메서드는 폼의 내용을 재설정하는 데 사용됩니다. 양식의 모든 입력, 텍스트 영역 및 선택 값을 초기 값으로 재설정합니다.

구문: ​​

jQuery 사용:

$(selector).trigger("reset");

JavaScript 사용:

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

매개변수 설명:

• selector: 재설정할 양식 선택기입니다.
• formId: 재설정할 양식의 ID입니다.

예:

jQuery 사용:

HTML 코드:

<form id="myForm">
    <label for="name">Name:</label>
    <input type="text" name="name" id="name" value="Tom"><br>
    <label for="gender">Gender:</label>
    <select name="gender" id="gender">
        <option value="male">Male</option>
        <option value="female" selected>Female</option>
    </select><br>
    <label for="bio">Bio:</label>
    <textarea name="bio" id="bio">This is my bio.</textarea><br>
    <input type="button" value="Reset" id="resetButton">
</form>

j쿼리 코드:

$(document).ready(function(){
    $("#resetButton").click(function(){
        $("#myForm").trigger("reset");
    });
});

JavaScript 사용:

HTML 코드:

<form id="myForm">
    <label for="name">Name:</label>
    <input type="text" name="name" id="name" value="Tom"><br>
    <label for="gender">Gender:</label>
    <select name="gender" id="gender">
        <option value="male">Male</option>
        <option value="female" selected>Female</option>
    </select><br>
    <label for="bio">Bio:</label>
    <textarea name="bio" id="bio">This is my bio.</textarea><br>
    <input type="button" value="Reset" id="resetButton" onclick="resetForm()">
</form>

JavaScript 코드:

function resetForm(){
    document.getElementById("myForm").reset();
}

성취 효과:

재설정 버튼 클릭 양식의 모든 내용이 지워집니다.

Notes

• jQuery 양식 재설정() 메서드는 양식의 모든 값을 기본값으로 재설정만 하며 양식의 오류 메시지를 지우거나 포커스 상태 및 스크롤 막대를 재설정하지 않습니다. 입력 상자의 위치입니다.
• jQuery 양식 재설정() 메서드를 사용할 때 양식의 기본 제출 동작을 방지하려면 event.preventDefault() 메서드를 사용해야 합니다.
• 양식에 재설정 버튼이 포함된 경우 모든 양식 요소의 값이 지워진다는 점에 유의해야 합니다. 클릭 이벤트에 event.preventDefault()를 사용하면 기본 동작을 방지할 수 있습니다.

요약

jquery 양식 재설정() 메서드는 양식을 지우는 데 사용되며 사용하기 쉽고 양식 내용을 빠르게 재설정할 수 있습니다. 그러나 실제 사용에서는 우리의 필요에 맞게 더 잘 적용할 수 있도록 몇 가지 제한 사항과 주의 사항에 주의를 기울여야 합니다.

위 내용은 jquery에서 재설정 메소드를 사용하여 양식 내용을 재설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!