Question

我对理解ajax使用有一些问题。让我们说我有这样的文件（这只是一个伪代码，请不要看看现在的基本错误）我读了这么多文章，但我发现它们很难理解

///////////////// file 1 /////////////////
        <?php
        x = 1;
        <button onclick=somefunction(x)></button>
        ?>

        <script>
        //here goes some ajax code sending this x variable to another php file
        </script>

让我们说它看起来像这样

////////////// file 2 ////////////////
    <?php
    /get x variable + sendint it back
    return x=2
    ?>

现在我要做的是让这个x值回到第一个脚本并使x = 2。我该怎么做？

Answer 1

这是一个使用JQuery和一些注释来尝试描述会发生什么的示例。

<html>
<!--file: ajax_basic.php-->
<head>
    <title>Ajax Basic Example</title>
</head>
<body>
  <input type="text" id="example_input" value="1">
  <button id="example_button">Example</button>        
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script type="text/javascript">
        $(document).ready(function(){

            // .click(function() executes an anonymous function when the button is clicked
            $('#example_button').click(function() {

                // get the current value from the input
                test_value = $('#example_input').val();

                // $.get is the AJAX method.
                // It sends the object {'sent_value': test_value} to test.php
                // function(response) is the the function that will be executed when
                // a response is returned from the test.php
                $.get('test.php', {'sent_value': test_value}, function(response) {
                    // here, x is taken from the response of the php script.
                    // You can do whatever you like with this value.
                    x = response.returned_value;

                    // for this example, it updates the value of the text input
                    $('#example_input').val(x);
                }, 'json');
            });
        });
    </script>
</body>
</html>

这是将处理请求的PHP文件。它为此示例所做的只是递增它接收的值并返回新值。

<?php
// file: test.php
$response = array('returned_value' => $_GET['sent_value'] + 1);
echo json_encode($response);

Answer 2

如果您使用的是jQuery，则应该从onclick=somefunction(x)切换到jQuery绑定，即。 .on() / .click() /等。见https://stackoverflow.com/a/826697/689579

使用jQuery你可以做类似的事情 -

<?php $x=1;>

<button id="mybutton">MyButton</button>

<script>
var x = <?php echo $x; ?>; // set initial x value to php value
$(function(){
    $('#mybutton').click(somefunction);
});
function somefunction(){
    $.ajax({
        url: 'phppage.php',
        data: {number:x}, // send current x value
        ...
        success: function(result){
            x = result; // when php file returns 2 (or other value increase x
        }
    });
}
</script>

了解ajax返回

2 个答案: