Javascript 如何使用AJAX和PHP更新网页_Javascript_Php_Html_Ajax

Javascript 如何使用AJAX和PHP更新网页

javascript php html ajax

Javascript 如何使用AJAX和PHP更新网页,javascript,php,html,ajax,Javascript,Php,Html,Ajax,我对html/css/javascript/php和所有相关的东西都很陌生。我只懂java。目前，我在html（）中设置了一个页面，将数据发布到调用api并显示一些数据的php页面。html是： <!DOCTYPE html> <html> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <meta content="wi

我对html/css/javascript/php和所有相关的东西都很陌生。我只懂java。目前，我在html（）中设置了一个页面，将数据发布到调用api并显示一些数据的php页面。html是：

<!DOCTYPE html>
<html>
  <head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <meta content="#db5945" name="theme-color">
    <!--<link type="text/css" rel="stylesheet" href="layout-styles.css"/>-->
    <title>float check</title>

    <style>
      body {
        background-color: #222222;
        color: #db5945;
      }

      #footer {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        text-align: center;
        color: #042E64;
        background-color: #222222;
        height: 18px;
      }
    </style>
  </head>

  <body>
    <form action="apitest.php" method="post">
      <input type="text" name="id" placeholder="id">
      <input type="submit">
    </form>

    <div id="footer">
      <a href="http://steampowered.com">Powered by Steam</a>
    </div>
  </body>
</html>


浮动支票
身体{
背景色：#22222；
颜色：#db5945；
}
#页脚{
位置：固定；
左：0；
底部：0；
宽度：100%；
文本对齐：居中；
颜色：#042E64；
背景色：#22222；
高度：18px；
}

php文件名为：

<html>
<head>
  <meta content="#db5945" name="theme-color">
  <style>
    body {
      background-color: #222222;
      color: #db5945;
    }
  </style>
</head>
<body>
<?php
  $apikey = "XXXXXX-STEAM-API-KEY-XXXXX";

  $input = $_POST["id"];
  while (substr($input, strlen($input) - 1) == "/" || substr($input, strlen($input) - 1) == " ") {
    $input = substr($input, 0, strlen($input) - 1);
  }

  $steamid = "";

  function isInteger($input){
    return(ctype_digit(strval($input)));
  }

  if (strpos($input, "/id/") !== false || isInteger(substr($input, strlen($input) - 17)) == false) {
    $pos = 0;
    if (strpos($input, "/id/") !== false) {
      $pos = strrpos($input, "d/") + 2;
    }

    $vanityurl = substr($input, $pos);
    $steamidAPI = "http://api.steampowered.com/ISteamUser/ResolveVanityURL/v0001/?key=" . $apikey . "&vanityurl=" . $vanityurl;
    $responseid = json_decode(file_get_contents($steamidAPI));

    $steamid = $responseid->response->steamid;
  } else {
    $steamid = substr($input, strlen($input) - 17);
  }

  echo("steamid: " . $steamid . "<br><br>");

  $playerItemsAPI = "http://api.steampowered.com/IEconItems_730/GetPlayerItems/v0001/?key=" . $apikey . "&SteamID=" . $steamid;

  do {
    $playerItems = json_decode(file_get_contents($playerItemsAPI));
  } while (is_null($playerItems));

  $inventoryAPI = "http://steamcommunity.com/profiles/" . $steamid . "/inventory/json/730/2";
  $inventory = json_decode(file_get_contents($inventoryAPI));

  $names = array();
  $float = array();
  $cases = 0;
  $keys = 0;

  for ($i = 0; $i < count($playerItems->result->items); $i++) {
    $id = $playerItems->result->items[$i]->id;
    $classid = $inventory->rgInventory->$id->classid;
    $instanceid = $inventory->rgInventory->$id->instanceid;
    $combination = $classid . "_" . $instanceid;
    $name = $inventory->rgDescriptions->$combination->market_name;

    if(substr($name, strlen($name) - 3, strlen($name)) == "Key") {
      $keys++;
    } else if (substr($name, strlen($name) - 4, strlen($name)) == "Case") {
      $cases++;
    } else {
      array_push($names, $name);
      if ($playerItems->result->items[$i]->attributes[2]->defindex == 8) {
        array_push($float, $playerItems->result->items[$i]->attributes[2]->float_value);
      } else {
        array_push($float, 0);
      }
    }
  }

  $tab = "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";

  for ($j = 0; $j < count($names); $j++) {
    $someOutput = true;
    echo(strtolower($names[$j]) . "<br>");
    if ($float[$j] != 0) {
      echo($tab . $float[$j] . "<br>");
    }
  }

  echo("items: " . (count($names) + $keys + $cases) . "<br>");
  echo("items discounting keys/cases: " . count($names) . "<br>");
  echo("keys: " . $keys . "<br>");
  echo("cases: " . $cases . "<br>");

  echo("<br>if you expected something to<br>show up and nothing did, check<br>your inventory privacy settings");
?>
</body>
</html>


身体{
背景色：#22222；
颜色：#db5945；
}

这就是我现在拥有的一切。我的目标是使用ajax使用php文件中的数据更新html页面上的信息，而无需刷新页面。这可能吗？如果是的话，我会怎么做

谢谢

在HTML文件中，您需要一个Javascript函数来使用对PHP文件的ajax调用，并将echo PHP文件的结果放在HTML文档的Div中。选中此链接，只需更改PHP文件的“ajax_info.txt”，但基本上这就是使用ajax调用的方式。以下是该函数的基本知识：

您就快到了，现在您需要做的就是利用并运行ajax请求（）：

笔记

返回false防止通过正常流程提交表单。（表示没有重定向到页面。）


您需要将jQuery库与上述javascript文件一起包含到项目中
jQuery（this）.serialize（）
只需将表单元素格式化为要发布到提供的url的数据（apitest.php
）
您必须弄清楚如何处理返回的数据。现在它只需通过console.log（数据）登录到控制台。

一般的共识是使用返回的数据并将其附加到文档中的某个位置
大多数人会将JSON
发回并正确处理。您也可以这样做-这样可以更轻松地处理数据

如果您想正确操作。
这里有很多地面。有许多非常小的细节通常没有得到遵守。但这就是互联网如此混乱的原因。盲人领导盲人。我花时间做这件事是因为你对这件事还不熟悉。在盲人攻击你之前，不妨学习一些好的技巧
HTML


我注意到的其他东西
替换：
  echo("items: " . (count($names) + $keys + $cases) . "<br>");
  echo("items discounting keys/cases: " . count($names) . "<br>");
  echo("keys: " . $keys . "<br>");
  echo("cases: " . $cases . "<br>");

  while (substr($input, strlen($input) - 1) == "/" || substr($input, strlen($input) - 1) == " ") {
    $input = substr($input, 0, strlen($input) - 1);
  }

与：
改变
$inventory = json_decode(file_get_contents($inventoryAPI));
$playerItems = json_decode(file_get_contents($playerItemsAPI));

到
现在，$inventory和$playerItems是数组。

for ($i = 0; $i < count($playerItems->result->items); $i++) {
  $id = $playerItems->result->items[$i]->id;

可能重复的
$return['items'] = count($names) + $keys + $cases;
$return['discount'] = count($names) ;
$return['keys'] = $keys ;
$return['cases'] = $cases ;
header(header('Content-Type: text/json; charset=utf-8');
echo json_encode($return);

  while (substr($input, strlen($input) - 1) == "/" || substr($input, strlen($input) - 1) == " ") {
    $input = substr($input, 0, strlen($input) - 1);
  }

$input = rtrim($_POST["id"]," /");

$inventory = json_decode(file_get_contents($inventoryAPI));
$playerItems = json_decode(file_get_contents($playerItemsAPI));

$inventory = json_decode(file_get_contents($inventoryAPI),1);
$playerItems = json_decode(file_get_contents($playerItemsAPI),1);

for ($i = 0; $i < count($playerItems->result->items); $i++) {
  $id = $playerItems->result->items[$i]->id;

foreach($playerItems['results']['items'] as $id){