PHP에서 버튼 클릭 이벤트에 응답하는 방법-PHP 튜토리얼-php.cn

PHP에서 버튼 클릭 이벤트에 응답하는 방법

王林

풀어 주다： 2023-04-07 20:34:01

원래의

7157명이 탐색했습니다.

PHP에서 버튼 클릭 이벤트에 응답하는 방법

PHP는 서버 측 코드이고, html은 클라이언트 측 코드입니다. 버튼의 onclick 이벤트를 구현하려면 클라이언트가 서버 측 함수를 호출하므로 서버에 요청을 제출해야 합니다.

간단하고 조잡한 방법이 있습니다. 즉, 버튼이 태그인 경우 href에서 실행할 PHP 페이지를 직접 작성할 수 있습니다(또는 window.location을 버튼에 바인딩하여 JS를 통해 PHP로 점프할 수 있습니다). . 이 접근 방식을 사용하려면 각 버튼에 대한 PHP 코드를 디자인해야 합니다.

내 접근 방식은 다음과 같습니다. 이벤트 + ajax 클릭 이벤트를 버튼에 바인딩한 다음 ajax를 실행합니다.

예:

server.php

<?php 
    if (isset($_POST[&#39;action&#39;]))
    {
        switch($_POST[&#39;action&#39;])
        {
            case "btn1":btn1();break;
            case "btn2":btn2();break;
            default:break;
        }
    }
    function btn1()
    {
        echo "hello 按钮1";
    }
    function btn2()
    {
        echo "hello 按钮2";
    }
?>

로그인 후 복사

index.php

<html>
<head>
    <style>
    div {width:600px;margin:200px auto;}
    .btn {
        background-color:#44c767;
        -moz-border-radius:28px;
        -webkit-border-radius:28px;
        border-radius:28px;
        border:1px solid #18ab29;
        display:inline-block;
        cursor:pointer;
        color:#ffffff;
        font-family:Arial;
        font-size:17px;
        padding:16px 31px;
        text-decoration:none;
        text-shadow:0px 1px 0px #2f6627;
    }
    .btn:hover {
        background-color:#5cbf2a;
    }
    .btn:active {
        position:relative;
        top:1px;
    }
    #btn2 {float:right;}
    </style>
    <script type="text/javascript" language="javascript" src="jquery.js"></script>
    <script type="text/javascript" language="javascript">
        function fun(n) {
            $.ajax({
                url:"server.php",           //the page containing php script
                type: "POST",               //request type
                data:{action: n.value},
                success:function(result){
                    alert(result);
                }
            });
        }
        function fun2(n) {
            var url = "server.php";
            var data = {
                action : n.value
            };
            jQuery.post(url, data, callback);
        }
        function callback(data) {
            alert(data);
        }
    </script>
</head>
<body>
    <div>
        <button type="button" class="btn" id="btn1" οnclick="fun(this)"  value="btn1">按钮1</button>
        <button type="button" class="btn" id="btn2" οnclick="fun2(this)" value="btn2">按钮2</button>
    </div>
</body>
</html>

로그인 후 복사