Question

我有一个jQuery脚本，当用户点击不同的按钮时更新跨度。它根据需要更新和显示。但我想用PHP获取这个“变量”并将其输入到文件中。当文档加载时，span的值为0，并在用户单击特定按钮时变高。当我将span的值写入我的文本文件时，它总是为0.帮助？

jQuery的：

$(".button").click(function()
{   
    $(this).addClass("button-clicked");

    $(this).siblings(".button").addClass("disabled");

    $(this).siblings(".rett").addClass("rett-ved-feil");

    $(this).unbind("click");
    $(this).siblings(".button").unbind("click");

    if($(this).hasClass("rett"))
    {
        rettVar++;

        $("#antall-rett").html(rettVar);
        $("#score").html(rettVar);

        $(this).addClass("button-clicked-riktig");
    }

});

PHP：

if (isset($_POST["submit"]))
    {
        $doc = new DOMDocument; 
        $doc->loadHTMLFile('index.php'); 
        $node = $doc->getElementById('score'); 

        $score = $node->nodeValue;

        $fil = fopen("score.txt","a");

        $loglinje =  $_POST["navn"] . ": " . $score;

        fwrite ($fil, $loglinje . "\n");
        fclose($fil);
    }

HTML：

<!doctype html>

<title>Huskampanje Quiz</title>

<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="mediaqueries.css">

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">   

<script src="js/jquery-1.11.2.js" type="text/javascript"></script>
<script src="js/myjs.js" type="text/javascript"></script>
<script src="js/scrollToggle.js" type="text/javascript"></script>

<section class="section" id="intro">

    <div class="content">

        <h1>Huskampanje quiz<br /><span class="handsome">Ta quizen her</span></h1>

    </div>

    <a href="#brannskader-section"><img src="img/pil.png" id="pil" /></a>

</section>

<section class="section" id="håndverker-section">

    <div class="content">

        <p>

            Når det gis et prisoverslag på en håndverkertejeneste kan endelig pris maks overstige..

        </p>

        <span class="button">5%</span>
        <span class="button">10%</span>
        <span class="button rett">15%</span>
        <span class="button">20%</span>

        <span class="steps">4/10</span>

    </div>

</section>

<section class="section" id="naturskade-section">

    <div class="content">

        <p>

            Ved påsketider har snøen ligget en stund på hyttetak, og oppnår høyere egenvekt enn når den er fersk. Om vi har et 
            hyttetak på 100 kvadratmeter og snødybden er 1 meter vil vekten av snøen være omlag..

        </p>

        <span class="button rett">30 tonn</span>
        <span class="button">10 tonn</span>
        <span class="button">5 tonn</span>
        <span class="button">20 tonn</span>

        <span class="steps">10/10</span>

    </div>

</section>

<ul id="sticky">

    <li id="header-sticky">Antall rett</li>

    <li id="antall-rett">0</li>

</ul>

<section id="resultat">

    <div class="content" id="resultat-content">

        <div class="score">

            <span id="score">0</span>

            <form action="index.php" method="post">

                <input type="text" name="navn">
                <input type="submit" name="submit">

            </form>
            <?php



    if (isset($_POST["submit"]))
    {
        $doc = new DOMDocument; 
        $doc->loadHTMLFile('index.php'); 
        $node = $doc->getElementById('score'); 

        $score = $node->nodeValue;

        $fil = fopen("score.txt","a");

        $loglinje =  $_POST["navn"] . ": " . $score;

        fwrite ($fil, $loglinje . "\n");
        fclose($fil);
    }

?>
        </div>

    </div>

</section>

Answer 1

正如他们告诉你的那样，Javascript是客户端，而PHP是服务器端。

这意味着客户端发生的事情，停留在那里，服务器根本不关心。如果您想使用该值更新文件，则有两种方法可以执行此操作。

1.AJAX，将值async发送到php文件并将所需值写入文件/数据库......

2.制作表格并检索数据并将其保存在您想要的位置。为此，制作隐藏的输入，例如每次点击都会增加。

编辑：对于数字2，如果您有多个页面，则可以使用名称隐藏输入，例如：＆＃34; right_answers＆＃34;

<form>
    ...
    <!-- first page -->
    <input type="hidden" name="right_answers" value="0">
    ...
</form>

然后在下一页的开头，检查答案是否正确：

<?php
    if($_POST['question'] == "answer") {
        $goodAnswer = $_POST['right_answers']+1;
    }
    else {
        $goodAnswer = $_POST['right_answer'];
    }
?>
<form>
    ...
    <input type="hidden" name="right_answers" value="<?php echo $goodAnswers; ?>">
    ...
</form>

这样您将始终知道用户所做的正确答案。这只是一个想法，确定有更好的方法。

Answer 2

您的PHP脚本（文件）将在您的服务器上运行。在世界某个地方打开过您的网页的用户无法查看或更改您的服务器端文件，例如您的PHP。打开网页的每个用户都看到相同的PHP，因此如果5个用户正在浏览您的页面，他们都会看到index.php为他们生成的内容。 PHP文件（HTML代码）的输出将在他们的浏览器中（在用户计算机的内存中），您可以使用jQuery对其进行修改。它将永远留在用户的记忆中。电脑。因此，如果您想保存用户键入的内容，您必须将其发送回您的服务器，这里PHP可以捕获它并为您保存。但是将它保存到文件并不是一个好主意，因为如果有5个用户发回数据，你应该为它们保存5个单独的文件（并且你必须识别所有用户）。但基本知识在这里：

你必须创建一个可以捕获输入的PHP文件，保存为ajax.php：

<?php
    $fil = fopen("score.txt","a");
    $loglinje =  "score:".$score;
    fwrite ($fil, $loglinje . "\n");
    fclose($fil);
?>

然后你必须将数据发送回服务器，所以你的jQuery代码应该是这样的：

<script>
$(".button").click(function()
{   
    $(this).addClass("button-clicked");

    $(this).siblings(".button").addClass("disabled");

    $(this).siblings(".rett").addClass("rett-ved-feil");

    $(this).unbind("click");
    $(this).siblings(".button").unbind("click");

    if($(this).hasClass("rett"))
    {
        rettVar++;

        $.ajax({
            url: '/ajax.php',
            type: 'post',
            dataType: 'json',
            data: {
                score: rettVar
            }
        })
        .always(function() {
        })
        .fail(function() {
            alert('There is an error occured.');
        })
        .done(function(result) {
            $("#antall-rett").html(rettVar);
            $("#score").html(rettVar);
            $(this).addClass("button-clicked-riktig");
        });     

    }

});
</script>

因此，jQuery将分数发送回服务器，将其保存给您。

我希望它有所帮助，但请注意，这段代码只是一个例子。我不推荐它在实际应用程序中使用，因为它有一些安全性退缩，也许你应该将值保存到数据库而不是文本文件。

用jQuery更新span，用PHP获取它？

2 个答案: