>웹 프론트엔드 >JS 튜토리얼 >페이지를 다시 로드하지 않고 $.load를 사용하여 양식 데이터를 제출하려면 어떻게 해야 합니까?

페이지를 다시 로드하지 않고 $.load를 사용하여 양식 데이터를 제출하려면 어떻게 해야 합니까?

Susan Sarandon
Susan Sarandon원래의
2024-11-11 07:14:021023검색

How Can I Submit Form Data with $.load Without Reloading the Page?

페이지 다시 로드 없이 $.load를 통해 데이터 제출

$.load()를 사용하여 양식 내에서 원격 콘텐츠를 로드할 때 다음이 발생할 수 있습니다. 데이터 제출 관련 문제. 이 문제는 요청이 양식과 동일한 페이지에서 처리되어 적절한 데이터 제출 대신 다시 로드되는 결과를 낳을 때 발생합니다.

이 문제를 해결하려면 AJAX 기술을 사용하여 외부 PHP 파일에 데이터를 게시하는 것이 좋습니다. 다음은 설명할 예입니다.

AJAX 코드(파일 #1):

<script>
$(function() {
    $('#Sel').change(function() {
        var opt = $(this).val();
        var someelse = 'Hello';
        var more_stuff = 'Goodbye';
        $.ajax({
            type: "POST",
            url: "receiving_file.php",
            data: 'selected_opt=' + opt + '&something_else=' +someelse+'&more_stuff='+more_stuff,
            success:function(data){
                alert('Data received: ' + data);
            }
        });
    });
});
</script>

PHP 파일 #2(receiver_file.php):

<?php
    $recd = $_POST['selected_opt'];
    echo 'Option chosen: ' . $recd;
?>

이 설정에서는 사용자가 드롭다운 선택을 변경하면 AJAX 요청은 receive_file.php로 전송되며, 데이터를 처리하고 페이지를 다시 로드하지 않고도 브라우저에 표시할 수 있는 응답을 반환합니다. 이는 양식 내에서 데이터가 올바르게 게시되지 않는 문제를 해결합니다.

위 내용은 페이지를 다시 로드하지 않고 $.load를 사용하여 양식 데이터를 제출하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.