如何在汽车销售网站上创建可缩放的“查看”按钮?

时间:2019-02-20 16:29:26

标签: javascript html

我正在为我的最后一个项目开发汽车销售网站。以下是我的目录页面的代码-这是可缩放的汽车列表,带有用于编辑和从我的网站和Firebase数据库中删除汽车的按钮。此刻,您可以单击锚点,它将带您到Item1.html页面。我要这样做,以便如果您单击列表上的第一项,它将带您到Item1.html,第二项将是Item2.html,依此类推。以下是我的目录页面上列出的项目的代码。任何帮助将不胜感激。

Catalogue.html

<div>
  <lo id="carList">
  </lo>
</div>

Catalogue.js

database.ref('car').once('value', function(snapshot){

    if(snapshot.exists()){
        var content = '';
        snapshot.forEach(function(data){
            var val = data.val();
            var key = data.key;

            content += '<div class="col-lg-4 col-sm-6 portfolio-item"><div class="card h-100">**<a href="Item1.html">**<img class="card-img-top" src="'+val.image+'" alt=""></a><div class="card-body"><h4 class="card-title"><a href="Item1.html">'+val.make+'&nbsp'+val.model+'</a></h4><p class="card-text">Price: '+val.price+'</br>Year: '+val.year+'</br><button id="modify" onclick="update(\''+key+'\')">Modify</button><button id="deleted" onclick="deleted(\''+ key+'\')">Delete</button></p></div></div></div>';
        });

        $('#carList').append(content);
    }
});

任何建议/替代方式都可以使我感激不已!

1 个答案:

答案 0 :(得分:0)

已更新:

更改此

 snapshot.forEach(function(data){

对此:

 var cntr = 0;
 snapshot.forEach(function(data,index){
     cntr++;

并更改此

<a href="Item1.html">

<a href="Item' + cntr + '.html">