Question

我有两个php文件home.php和ajax.php。我在home.php上有两个按钮。单击它们时，ajax.php中的相应php函数应该被调用。

home.php

<html>
    <head>
        <script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
        <script type='text/javascript'>
        $(document).ready(function(){
            $('.button').click(function(){
                var clickBtnValue = $(this).val();    
                var ajaxurl = 'ajax.php';
                data =  {'action': clickBtnValue};

                $.post(ajaxurl, data, function (response) {
                    // Response div goes here.
                    alert("action performed successfully");
                });

            });
        });
        </script>
    </head>

    <body>
        <form action='ajax.php' method="POST">
            <input type="submit" class="button" name="insert" value="insert" />
            <input type="submit" class="button" name="select" value="select" />
        </form>
    </body>
</html>

ajax.php

<?php
echo 'this was called';
echo $_POST['action']; //THROWS AN ERROR undefined index 'action'

if ( isset( $_POST['action'] ) ) {

    switch ($_POST['action']) {
        case 'insert':
            insert();
            break;
        case 'select':
            select();
            break;
    }
}

function select() {
    echo "The select function is called.";
    exit;
}

function insert() {
    echo "The insert function is called.";
    exit;
}
?>

问题是我在jquery代码中分配给data属性的 json 数据不会传递给ajax.php。它有什么理由不通过吗？

这是关于错误video

的我的YouTube视频

Answer 1

根据您之后想要达到的目标，有两种可能性。

Eighter你坚持做一个背景ajax-调用ajax.php ，然后做任何你想做的回应（这就是我的建议）：

<html>
<head>
    <script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
    <script type='text/javascript'>
    $(document).ready(function(){
        $('.button').click(function(){
            var clickBtnValue = $(this).id(); // changed to id here!
            var ajaxurl = 'ajax.php';
            data =  {'action': clickBtnValue};

            $.post(ajaxurl, data, function (response) {
                // Response div goes here.
                console.log(response); // log what the response is
                alert("action performed successfully and the resonse is: \n"+response);
                // do with that data whatever you need
            });

        });
    });
    </script>
</head>

<body>
    <!-- changed to buttons, removed the form -->
    <button class="button" id="insert">insert</button>
    <button class="button" id="select">select</button>
</body>
</html>

或者您在屏幕上提交表单并输出来自ajax.php的响应：

<html>
<head>
    <!--script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script-->
    <script type='text/javascript'>
    // no need for any javascript then
    </script>
</head>

<body>
    <form action='ajax.php' method="POST">
        <input type="submit" class="button" name="insert" value="insert" />
        <input type="submit" class="button" name="select" value="select" />
    </form>
</body>

并在ajax.php中：

<?php
echo 'this was called';


if ( isset( $_POST['insert'] ) ) {
        insert();
}

if ( isset( $_POST['select'] ) ) {
        select();
}

function select() {
  echo "The select function is called.";
  exit;
}

function insert() {
  echo "The insert function is called.";
  exit;
}
?>

Answer 2

尝试

$.post(ajaxurl, data)
  .done(function( r ) {
   alert("action performed successfully");
});

Answer 3

我喜欢使用jQuery on()并确保帖子有效，我已经移动了你的变量。此外，您可以在点击后尝试console.log(clickBtnValue)，以确保您能够看到值本身。确认后，post（）应该将该值发送到param后的行动中。

<script type='text/javascript'>
$(document).ready(function(){
    $('.button').on('click',function(){
        var clickBtnValue = $(this).val();    
        var ajaxurl = 'ajax.php';

        $.post(ajaxurl, {action:clickBtnValue}, function (response) {
          alert("action performed successfully");
        });
    });
});
</script>

Answer 4

如果您需要进行ajax调用，请从home.php中删除以下部分

<form action='ajax.php' method="POST">
</form>

我认为你搞砸了Ajax技术和表单发布机制。

为什么我不能将json数据传递给另一个PHP文件？

4 个答案: