第一次和第二次点击显示从PHP检索到的第三个显示答案的提示

时间:2018-02-23 13:01:44

标签: javascript php jquery ajax

这样做的想法是在向他显示答案之前向用户显示一些提示。

<button name="help" id="helpBtn" onclick="" type="submit" value="Help"></button>

首先,第二次点击<span id="ShowHelp"></div>应该向用户显示一些提示,第三次点击它应该显示将从服务器检索的用户的答案

以下是我尝试这样做的方法。

HTML

<button name="help" id="helpBtn" onclick="" type="submit" value="Help"></button>
<span id="ShowHelp"></div>
<?php $answer = "This is the answer to be shown on third click"; ?>

JS

$('#helpBtn).click(function(e) { //pseudocode
    e.preventDefault();

    (ON first click) { $("#showHelp").html("HINT 1"); } 
    (ON second click) { $("#showHelp").html("HINT 2"); } 
    (ON third click) { //SHOW HIDDEN ANSWER RETRIEVED FROM PHP } 
});

2 个答案:

答案 0 :(得分:1)

使用计数器。请注意,这是在jquery .click函数

之外

<强> PHP

//phpfile.php
     <?php $answer = "This is the answer to be shown on third click";
    echo json_encode(['code'=>$answer]);
     ?>

&#13;
&#13;
     var count = 0
$('#helpBtn').click(function(e){
    e.preventDefault();
    count++;
    var Relresult = $("#ShowHelp");
    if(count === 1){Relresult.html("hint1");}
    else if(count === 2){Relresult.html("hint 2");}
    else if(count ===3){
       alert("some Php Variable");
         $.ajax({
  type: "POST",
  url: "phpfile.php",
  dataType: "json",
 }).done(function( data ) {
        Relresult.html(data.code);
    }); 
    }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button style="width:200px;height:100px" name="help" id="helpBtn" onclick="" type="submit">help</button>
<span id="ShowHelp"></div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您可以使用数据属性:

<button name="help" id="helpBtn" data-count="1">

然后你可以使用(jquery):

$(this).data("count");

访问点击次数。单击按钮时,您可以为此数字添加1。