0

假设我在一个 PHP 文件中有一个名为 的 div myDiv、一个名为 的图像myImg和一个名为 的 PHP 变量$x。当有人点击 时myImg，我需要myDiv's根据 的值更改文本$x。

例如，假设我希望myDiv's将文本更改为"Hello"if$x==1和"Bye"if $x==2。

每次文本改变时， 的值$x也会改变，在这种情况下，假设$x==1当myImg被点击时，$x's值将变为2($x=2)，反之亦然。

我正在使用jQuery，但我读到我也需要为此使用Ajax（在服务器上检查 的值$x），但我不知道该怎么做。我读过关于Ajax，但没有一个例子解释了这样的事情。

4

2 回答 2

1

我将在新答案中添加修改后的解决方案，以便您仍然可以看到早期的示例，因为代码可能会提供有用的示例。

在此示例中，我们使用会话变量来存储 ajax 调用之间的值。

文件1.php

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function(){
        $('#myImg').click(function() {
            $.ajax({
                type: "POST",
                url: "FILE2.php",
                data: '',
                success:function(data){
                    alert(data);
                }
            });
        });
    });
</script>

<div id="myDiv">
    Click picture below to GO:<br />
    <img id="myImg" src="http://www.gravatar.com/avatar/783e6dfea0dcf458037183bdb333918d?s=32&d=identicon&r=PG">
</div>

文件2.php

<?php
session_start();

if (isset($_SESSION['myNum'])) {
    $x = $_SESSION['myNum'];
}else{
    //No session set yet, so initialize with x = 1
    $x = 1;
}

if ($x == 1) {
    $_SESSION['myNum'] = 2;
    echo 'Hello its a one';
}else{
    $_SESSION['myNum'] = 1;
    echo 'Goodbye TWO';
}
?>
于 2012-11-21T20:08:38.250 回答
0

你不需要ajax，但你可以使用它。如果您使用 AJAX，那么您将需要一个简单地回显 Hello 或 Bye 的第二个 php 文件。

第一个示例给出了您想要的结果，无需 ajax。只需将其保存到 PHP 文件中并浏览到该页面：

<?php
    $x = 2;
?>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function(){
        $('#myImg').click(function() {
            if (<?php echo $x;?> == 1) {
                alert ('Hello, its a one');
            }else{
                alert('Goodbye TWO');
            }
        });
    });
</script>

<div id="myDiv">
    Click on the image below:<br />
    <img id="myImg" src="http://www.gravatar.com/avatar/783e6dfea0dcf458037183bdb333918d?s=32&d=identicon&r=PG">
</div>

要使用 AJAX 执行相同的操作，请将其更改为：

第一个文件：FILE1.php

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function(){
        $('#myImg').click(function() {
            var theNumber = $('#myInput').val();
            $.ajax({
                type: "POST",
                url: "FILE2.php",
                data: 'myNumber=' + theNumber,
                success:function(data){
                    alert(data);
                }
            });
        });
    });
</script>

<div id="myDiv">
    Enter number to send to FILE2:
    <input type="text" id="myInput"><br />
    <br />
    Click picture below to GO:<br />
    <img id="myImg" src="http://www.gravatar.com/avatar/783e6dfea0dcf458037183bdb333918d?s=32&d=identicon&r=PG">
</div>

和 FILE2.php

$x = $_POST['myNumber'];

if ($x == 1) {
    echo 'Hello its a one';
}else{
    echo 'Goodbye TWO';
}
于 2012-11-21T19:22:05.290 回答