Question

无论如何，我已经把这个json的东西搞砸了几个小时。就像我的意思是8+。在了解了html和css之后我才进入php。能指出他出错的伙伴。这实际上是我得到的最远的...... Hardy har har。

 <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="/style.css" />
</head>
<?php
// copy file content into a string var
$json = file_get_contents('data.json');

function decodejson(){
    $jd = json_decode($json,true);
    $curated = array();
    foreach($jd(['curated']) as $key => $jd){
        $value = json_decode($jd, true);
        $category = $jd->category;
        $title = $jd->title;
        $brand = $jd->brand;
        $image = $jd->image;
        $author = $jd->author;
        $like = $jd->like;
        $link = $jd->link;
        $price = $jd->price;
    }
    return;
}
?>


<body>
<div class="container-fluid">
  <!--START OF ROW-->
  <div class="row">
    <!--Product Start--><div class="col-4-4 tile">
      <div class="price">
        <h4><?php echo  $jd['price']; ?></h4>
      </div>
      <div class="image">
        <img class="center-block" src="<?php echo  $json['image']; ?>">
      </div>
      <div class="title">
        <h6><?php echo  $jd['title']; ?></h6>
      </div>
      <div class="brand">
        <h6><?php echo  $json['brand']; ?></h6>
      </div>
      <div class="col-4-4">
        <div class="social-footer">
          <div class="col-4-4 trending">
            <h4>Trending<h4>
    </div>
        <div class="col-4-4 likes">
          <span class="fa fa-heart"><?php echo  $jd['like']; ?><span>
      </div>
        </div>
  </div>
</div><!--Product END-->
 </div>
 </div>
</body>
</html>

JSON BELOW：

{

    "curated": [ 
      { "category": "home",
        "title": "Tosca Umbrella Stand, White",
        "brand": "YAMAZAKI HOME",
        "image": "http://i67.tinypic.com/5bwug3_th.jpg",
        "author": "mysunshineaway",
        "like": "3",
        "link": "http://google.com",
        "price": "82"
      },
            { "category": "home",
        "title": "Tosca Umbrella Stand, White",
        "brand": "YAMAZAKI HOME",
        "image": "http://i67.tinypic.com/5bwug3_th.jpg",
        "author": "mysunshineaway",
        "like": "3",
        "link": "http://google.com",
        "price": "82"
      },
            { "category": "home",
        "title": "Tosca Umbrella Stand, White",
        "brand": "YAMAZAKI HOME",
        "image": "http://i67.tinypic.com/5bwug3_th.jpg",
        "author": "mysunshineaway",
        "like": "3",
        "link": "http://google.com",
        "price": "82"
      }
  ]
  }

以下样式：

body {
  background-color: #2c3e50;
}
.row {
width: 100%;
text-align: center;
  display: inline-block;
}
.tile {
  margin: 30px 30px;
  background-color: #ecf0f1;
  width: 25vw;
  height: 50vh;
  display: inline-block;
}

.tile .price {
  background-color: #27ae60;
  width: 90px;
  height: 40px;
  float: right;
}
.tile .price h4 {
  color: #ecf0f1;
  position: relative; 
  font-weight: 600;
  text-align: center;
}
.tile .image img {
  height: 30vh;
  width: auto;
  display: block;
  margin-top: 10vh;
  align-content: center
}
.tile .title h6 {
  color: #95a5a6;
  text-align: left;
  display: block;
  padding-left: 10px;
  font-size: 15px;
}
.tile .brand h6 {
  color: #95a5a6;
  text-align: left;
  display: block;  padding-left: 10px;
  font-size: 15px;
}
.tile .social-footer {
  display: block;
  height: 35px;
  width: auto;
  position: relative;
  margin-top: -4px;
  background-color: #ecf0f1;
}
.tile .social-footer .trending h4{
  color: #95a5a6;
  padding-top: -5px;
  padding-left: 10px;
  font-weight: 600;
  float:left;
}
.tile .social-footer .likes span {
  color: #7f8c8d;
  display: block;
  font-size: 20px;
  position: relative;
  text-align: right;
  padding-top: 7px;
  padding-right: 10px;
}


.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto;
 }

/*BOOTSTRAP CENTERING*/
.container-fluid{
  height:100%;
  display:table;
  width: 100%;
  padding: 0;
}




@media (max-width: 1000px){
  .tile {
  margin: 30px 30px;
  background-color: #ecf0f1;
  width: 40vw;
  height: 80vh;
  display: inline-block;
}
  .tile .image img {
  height: 50vh;
  width: auto;
  display: block;
  margin-top: 15vh;
  align-content: center
}
  .tile .social-footer {
  display: block;
  height: 50px;
  width: auto;
  position: relative;
  margin-top: 32px;
  background-color: #ecf0f1;
}
.tile .social-footer .trending h4{
  color: #95a5a6;
  padding-top: 7px;
  padding-left: 10px;
  font-weight: 600;
  float:left;
}
.tile .social-footer .likes span {
  color: #7f8c8d;
  display: block;
  font-size: 25px;
  position: relative;
  text-align: right;
  padding-top: 15px;
  padding-right: 30px;
}
}
@media (max-width: 900px){
  .row {
width: 100%;
text-align: center;
}
  .tile {
  margin: 30px 30px;
  background-color: #ecf0f1;
  width: 90vw;
  height: 90vh;
  display: inline-block;
} 
    .tile .image img {
  height: 60vh;
  width: auto;
  display: block;
  margin-top: 15vh;
  align-content: center
}
    .tile .social-footer {
  display: block;
  height: 50px;
  width: auto;
  position: relative;
  margin-top: 34px;
  background-color: #ecf0f1;
}
.tile .social-footer .trending h4{
  color: #95a5a6;
  padding-top: 7px;
  padding-left: 10px;
  font-weight: 600;
  float:left;
}
.tile .social-footer .likes span {
  color: #7f8c8d;
  display: block;
  font-size: 25px;
  position: relative;
  text-align: right;
  padding-top: 15px;
  padding-right: 30px;
}
}

Answer 1

事实证明我的职能所有人都在捣乱，我需要打到书本。感谢Barmar和Carcigenicate的帮助

function &decodejson(){
$json = file_get_contents('data.json');
$jd = json_decode( $json, true);
    $curated = array();
     foreach($json(['curated']) as $key => $jso){
         $value = json_decode($jso, true);
        $category = $jso->category;
        $title = $jso->title;
        $brand = $jso->brand;
        $image = $jso->image;
        $author = $jso->author;
        $like = $jso->like;
        $link = $jso->link;
        $price = $jso->price;
        return $jso;
    }

    }
    $jd =& decodejson();

没有什么，但JSON错误，PHP相关

1 个答案: