Jquery 양식에서 사용되는 방법은 무엇입니까

jquery에서는 ajaxForm()과 ajaxSubmit() 두 가지 방법을 사용하여 "jquery form"을 사용할 수 있습니다. "jquery form"은 양식을 제출하고 매개변수를 설정하는 데 사용됩니다. 양식 제출 전 양식 데이터 확인 및 처리와 양식 제출 후 기능 호출에 사용할 수 있습니다.

이 튜토리얼의 운영 환경: windows10 시스템, jquery3.2.1 버전, Dell G3 컴퓨터.

jquery form 사용 방법

jquery form은 비동기식 양식 제출을 위한 플러그인으로, 양식을 쉽게 제출하고, 양식 제출을 위한 매개변수를 설정하고, 양식을 제출하기 전에 양식 데이터를 확인 및 처리하고, 이후에 함수를 호출할 수 있습니다. 양식이 제출되었습니다.

이 플러그인에는 두 가지 주요 방법이 있습니다:

ajaxForm() 및 ajaxSubmit(),

양식 요소 제어부터 제출 프로세스 관리 방법 결정까지의 기능을 결합합니다.

둘 다 0개 또는 하나의 매개변수를 허용할 수 있습니다. 매개변수는 json 형식과 유사한 함수 또는 JS 객체일 수 있습니다.

ajaxForm()은 양식을 제출할 수 없으며 단지 양식 제출을 준비합니다.

1: 함수를 전달합니다.

$("#form1").submit(function () {
    $('#form1').ajaxForm(function () {
        alert("提交成功2")
    })
})

하지만 많은 것을 읽었습니다. 실제 코드를 실행해보니 "Submission Success 2"가 인쇄되지 않은, 즉 함수가 입력되지 않은 것을 발견했습니다.

그리고 제출 후 해당 페이지로 이동합니다. 즉, 이 메서드는 폼을 구현할 수 없습니다. 비동기식 제출은 단지 폼 제출을 준비하기 위한 것이지만 함수를 전달하는 방식은 입력되지 않기 때문에 이 메서드에는 적합하지 않습니다. 내 글에 문제가 있다면. 그러나 전달된 옵션이 객체인 경우에는 적용됩니다.

var options = {
    url: "/day09/jqueryFormServlet", //提交地址：默认是form的action,如果申明,则会覆盖
    type: "post",   //默认是form的method（get or post），如果申明，则会覆盖
    beforeSubmit: beforeCheck, //提交前的回调函数
    success: successfun,  //提交成功后的回调函数
    target: "#output",  //把服务器返回的内容放入id为output的元素中
    dataType: "json", //html(默认), xml, script, json...接受服务端返回的类型
    clearForm: true,  //成功提交后，是否清除所有表单元素的值
    resetForm: true,  //成功提交后，是否重置所有表单元素的值
    timeout: 3000     //限制请求的时间，当请求大于3秒后，跳出请求
};

2: js 객체 전달

$('#form1').ajaxForm(options)

ajaxSubmit() 메서드: 양식의 비동기 제출 구현

$("#form1").submit(function () {
    $('#form1').ajaxSubmit(function () {
        alert("提交成功2")
    })
    return false;
})

여기에서 false를 반환해야 합니다. 그렇지 않으면 양식이 두 번 제출됩니다. 왜냐하면 양식은 비동기적으로 한 번, 다음에 한 번 제출되기 때문입니다. default;

$('#form1').ajaxSubmit(options)

그러나 옵션 개체가 전달되면 한 번만 제출됩니다.

추천 비디오 튜토리얼:jQuery 비디오 튜토리얼

위 내용은 Jquery 양식에서 사용되는 방법은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!