Ajax jquery mysqli更新

I'm trying to do a Ajax demo to teach myself the concept but I just can't make it work.

The sample I'm trying to get is to take a variable on the first page (in this case, the colour green) and if the green button is clicked, use that on the ajax processing page to record somehow that the green button was clicked (currently in the error log, then I'll move onto storing it in a database).

Ideally I'd like to be able to reuse the same snippet to change the variable to red, and have the error log report that the red button was pressed.

I've used the location.reload and the random number to prove to myself that the javascript is executing, and that the page is different with each load.

I'm not a javascript guy at all, you may be able to tell. Do I need to declare the a variable first or something else entirely?

uglytest.php

<script src="https://code.jquery.com/jquery-2.2.3.js"></script>
<!-- jQuery Ajax -->
<script type="text/javascript">
function clickyes(a) {
$.ajax({
       type: "POST",
       url: "./ajax.php",
       data: {"test":a},
       success: function (response) {
       default = $("#default").val();
       });
    location.reload();
}
</script>

<script type="text/javascript">
function clickno() {
    location.reload();
}
</script>


<?
echo mt_rand(0,99);
$result = "green"; 

echo "<p><form>here's a $result button. Do you want click on it?</p>";
echo "<button onclick=\"clickyes(" . $result . ")\" style=\"background-color: $result; \">Yes</button>";
echo "<button onclick=\"clickno()\">No</button></form>";

?>

ajax.php

<?
  $test = $_POST['test'];
   error_log($test, 0);
?>

3个回答

changes here:

function clickyes(a) {
$.ajax({
       type: "POST",
       url: "./ajax.php",
        data: {test:a},
       success: function () {
           location.reload();
       }
       });
}

and here:

echo "<p><form>here's a $result button. Do you want click on it?</p>";
echo "<button onclick=\"clickyes('$result')\" style=\"background-color: $result; \">Yes</button>";
echo "<button onclick=\"clickno('$result')\">No</button></form>";

made it work. Hooray!

Here location.reload will be called without waiting for the ajax request, as ajax is a async function. This may be the issue. Keep reload in the success of ajax response.

function clickyes(a) {
$.ajax({
       type: "POST",
       url: "./ajax.php",
       data: {"test":a},
       success: function (response) {
       default = $("#default").val();
       location.reload();
       });

}


Also Change this: 
echo "<button onclick=\"clickyes('" . $result . "')\" style=\"background-color: $result; \">Yes</button>";
doumu4032
doumu4032 echo“<button onclick = \”clickyes('“。$ result。”')\“style = \”background-color:$ result; \ “>是</按钮>”;
4 年多之前 回复
dpchen2004
dpchen2004 乔希......只是一个实验。 如果我使用随机数改变按钮的颜色然后使用ajax代码记录被推送的颜色怎么办?
4 年多之前 回复
douhao6557
douhao6557 约翰......没有,没有工作。
4 年多之前 回复
duannan4486
duannan4486 如果有人需要继续重新加载,那么为什么要使用ajax
4 年多之前 回复
<script src="https://code.jquery.com/jquery-2.2.3.js"></script>
<form><p id="color-info">here's a  button. Do you want click on it?</p>
    <button color="" id='yesbutton'>Yes</button>
    <button >No</button></form>

<script type="text/javascript">
setColor();
// this code will be invoked when #yesbutton is clicked and this is called dedication method
$(document).on('click','#yesbutton',function(e){
  e.preventDefault();
  $.ajax
  ({
   type: "POST",
   url: "./ajax.php",
   data: {"test":$('#yesbutton').attr('color')},
   success: function (response) {
      //default = $("#default").val();
      //change color after success
      setColor();

   }


   });

});

// function first determine rgb color to create composite color
function setColor()
{
  //redcolor code
  $redcolor=Math.random()*255;
  // green color code
  $greencolor=Math.random()*255;

  //blue color code
  $bluecolor=Math.random()*255;
  //this will set the background color for first time
  $rgb=parseInt($redcolor)+','+parseInt($greencolor)+','+parseInt($bluecolor);
  $('#color-info').text("here's a rgb("+$rgb+") button. Do you want click on it?");
  $('#yesbutton').css("background",'rgb('+$rgb+')');
  //this will set the color attribute for first time
  $('#yesbutton').attr('color',$rgb);


}

</script>
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐