0

我再次，我真的进入 php 现在我只需要先知道一些事情。首先，我试图在不重新加载客户端页面的情况下回发到服务器。这是我想要做的一个例子：我必须文本框，现在当用户在两个文本框中输入一个数字并单击添加按钮时，应该计算总值并将其显示在第三个文本框中而不重新加载页面，我'已经阅读了一些关于 ajax 的内容，但我在实现它时遇到了麻烦。

<?php
    if (isset($_POST["add"]))
    {
        $val1 = $_POST["val1"];
        $val2 = $_POST["val2"];

        $result = $val1 + $val2;
    }
?>

<html>
    <head>
        <title></title>
        <script src="jquery-1.9.1.min.js" ></script>
        <script type="text/javascript">
        $(document).ready(function() {
            if ($("#btn").click)
            {
                var request = $.ajax({
                url: "postback.php",
                type: "POST",
                data: {
                    val1 : "what goes here?",
                    val2 : "what goes here?"

                }

                });
                request.done(function(msg) {
                    $("#log").html( msg );
                });
                request.fail(function(jqXHR, textStatus) {
                alert( "Request failed: " + textStatus );
                });
            }
        });
        </script>
    </head>

    <body>
        <input type="input" name="val1">
        <input type="input" name="val2">
        <input type="input" name="result" value="<?php echo $result ?>">
        <input type="submit" id="btn" name="add">
    </body>
</html>
4

3 回答 3

2

不要混合你的 JavaScript 和你的 PHP 逻辑。将它们分开。

您需要将您的 jQuery 发布到另一个文件，并在此文件中回显您的 PHP 的结果。

然后这个结果将被放置在.done()方法中（虽然我会使用.success()，而你使用 jQuery / JavaScript 来更新你的 HTML 的内容）。

到此结束时，您的 HTML / JS 文件中应该没有任何 PHP 。

test.php 中的 PHP 代码

从这里，我们可以看到您需要通过发布一个 val1 和一个 val2，所以这是一个非常基本的脚本。

if (isset($_POST))
{
    $val1 = isset($_POST["val1"]) ? $_POST["val1"] : 'No value 1 passed through';
    $val2 = isset($_POST["val2"]) ? $_POST["val2"] : 'No value 2 passed through';

    if (is_int($val1) && is_int($val2))
    {
        // They're integers, add them
        $result = $val1 + $val2;
    }
    else
    {   
        // They're strings, append them
        $result = $val1 . $val2;
    }

    echo $result;
}

这就是您在 PHP 中所需要的。

你的 HTML / JS

$(document.ready(function() {
    $("#add").click(function(e) {
        e.preventDefault();

        $.ajax({
            url: 'test.php',
            type: 'POST',
            data: {
                'val1' : $("#val1").val(),
                'val2' : $("#val2").val()
            },
            success: function(data, status) {
                $("#result").html(data)
            }
        });
    });
});

<div id="result">Result should appear here</div>
<form>
    <input type="text" id="val1" name="val2" />
    <input type="text" id="val2" name="val2" />
    <input type="submit" id="add" name="add" />
</form>

就是这样。很简单。注意，未经测试，所以试一试。

于 2013-05-16T10:24:27.887 回答
1

如果您不想将 JS 和 PHP 分开，请遵循以下步骤：

1. 您应该将输入类型设置为按钮<input type="button" id="btn" name="add">
2. 您还应该add在 ajax 调用中发布
3. 您应该从文本框中获取值$('#val1').val()
4. 您应该停止回显两个值后的代码，因为如果不这样做，ajax 将返回其余的 html 代码和页面内容。5. 最后，您应该通过JavaScript
将新值添加到第三个输入，而不是 php，因为它是 ajax 并且页面不会重新加载。

尝试这个：

<?php
if(isset($_POST["add"])){
    $val1 = $_POST["val1"];
    $val2 = $_POST["val2"];
    $result = $val1+$val2;
    echo $result;
    die();
}
?>

<html>
<head>
    <title></title>
    <script src="jquery-1.9.1.min.js" ></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $("#btn").click(function(){
            var request = $.ajax({
            url: "postback.php",
            type: "POST",
            data: {
                val1 : $('#val1').val(),
                val2 : $('#val2').val(),
                add : "ok"
            }

            });
            request.done(function(msg) {
                console.log(msg);
                $("#result").val( msg );
            });
            request.fail(function(jqXHR, textStatus) {
            alert( "Request failed: " + textStatus );
            });
        });
    });
    </script>
</head>
<body>
    <input type="input" id="val1">
    <input type="input" id="val2">
    <input type="input" id="result" value="">
    <input type="button" id="btn" name="add">
</body>
</html>
于 2013-05-16T10:26:09.217 回答
0

您需要返回结果

$result = $val1 + $val2;

利用

echo $result;
exit;
于 2013-05-16T10:03:09.573 回答