那些遇到过的问题

如何将下载计数器附加到我的HTML下载按钮？

Ami*_*aik 6 html php asp-classic

我是一名新手设计师,可以使用HTML设计我自己的网站,我已经上传了我的emagazine文件.这是我计划在我网站上的下载页面:http://www.aamaodisha.org/secdownload.html

正如您所看到的,在这个下载页面上,我已经放置了我的电子杂志的6个版本的图像,并为每个版本连接了下载按钮,以便每当用户点击下载按钮时,该特定文件(.RAR文件) )将开始下载.就像我说的,我用普通的HTML和CSS设计了这些按钮.

我希望拥有的是每个杂志版本的下载计数器附加到特定的下载按钮 - 这意味着你可以在我的HTML页面上看到每个版本下面要下载的下载数量.如何拥有这样的东西？我可以用html安排吗？

6下载按钮的HTML代码:

<div class="button button1">
      <a href="#my link">Download</a>
      <p class="top">Click to begin</p>
      <p class="bottom">7.54 MB .RAR</p>
</div>
<div class="button button2">
      <a href="#my link">Download</a>
      <p class="top">Click to begin</p>
      <p class="bottom">7.8 MB .RAR</p>
</div>
<div class="button button3">
      <a href="#my link">Download</a>
      <p class="top">Click to begin</p>
      <p class="bottom">7.05 MB .RAR</p>
</div>
<div class="button button4">
      <a href="#my link">Download</a>
      <p class="top">Click to begin</p>
      <p class="bottom">3.8 MB .RAR</p>
</div>
<div class="button button5">
      <a href="#my link">Download</a>
      <p class="top">Click to begin</p>
      <p class="bottom">7.5 MB .RAR</p>
</div>
<div class="button button6">
      <a href="#my link">Download</a>
      <p class="top">Click to begin</p>
      <p class="bottom">8 MB .RAR</p>
</div>
Run Code Online (Sandbox Code Playgroud)

这是按钮的CSS:

.button {
  width: 115px;
}

.button1 {
    position:absolute;
    left:430px;
    top:410px;

}    
.button2 {
    position:absolute;
    left:632px;
    top:410px;

}  
.button3 {
    position:absolute;
    left:833px;
    top:410px;

}    
.button4 {
    position:absolute;
    left:430px;
    top:636px;

}    
.button5 {
    position:absolute;
    left:632px;
    top:636px;

}   
.button6 {
    position:absolute;
    left:833px;
    top:636px;

}   
.button a {
  display: block;
  height: 28px;
  width: 115px;

  /*TYPE*/
  color: white;
  font: bold 11px/28px Helvetica, Verdana, sans-serif;
  text-decoration: none;
  text-align: center;
  text-transform: uppercase; 

  /*GRADIENT*/  
  background: #00b7ea; /* Old browsers */
  background: -moz-linear-gradient(top, #00b7ea 0%, #009ec3 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00b7ea), color-stop(100%,#009ec3)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #00b7ea 0%,#009ec3 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #00b7ea 0%,#009ec3 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #00b7ea 0%,#009ec3 100%); /* IE10+ */
  background: linear-gradient(top, #00b7ea 0%,#009ec3 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 ); /* IE6-9 */
}

.button a, p {
    -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;

  -webkit-box-shadow: 2px 2px 8px rgba(0,0,0,0.2);
     -moz-box-shadow: 2px 2px 8px rgba(0,0,0,0.2);
          box-shadow: 2px 2px 8px rgba(0,0,0,0.2);
}

.button p {
  background: #222;
  display: block;
  height: 25px;
  width: 105px;
  margin: -27px 0 0 5px;

  /*TYPE*/
  text-align: center;
  font: bold 10px/28px Helvetica, Verdana, sans-serif;
  color: #ffffff;

  /*POSITION*/
  position: absolute;
  z-index: -1;

  /*TRANSITION*/  
  -webkit-transition: margin 0.4s ease;
     -moz-transition: margin 0.4s ease;
       -o-transition: margin 0.4s ease;
      -ms-transition: margin 0.4s ease;
          transition: margin 0.4s ease;
}

/*HOVER*/
.button:hover .bottom {
  margin: -4px 0 0 5px;
}

.button:hover .top {
  margin: -50px 0 0 5px;
  line-height: 22px;
}

/*ACTIVE*/
.button a:active {
background: #00b7ea; /* Old browsers */
background: -moz-linear-gradient(top,  #00b7ea 36%, #009ec3 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(36%,#00b7ea), color-stop(100%,#009ec3)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #00b7ea 36%,#009ec3 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #00b7ea 36%,#009ec3 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #00b7ea 36%,#009ec3 100%); /* IE10+ */
background: linear-gradient(top,  #00b7ea 36%,#009ec3 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 ); /* IE6-9 */

}

.button:active .bottom {
  margin: -14px 0 0 5px;
}

.button:active .top {
  margin: -30px 0 0 5px;
}
Run Code Online (Sandbox Code Playgroud)

我有另一个疑问:我曾在谷歌搜索过下载计数器,而且我已经阅读了某个地方,而不是直接在href中给出我的杂志文件的真实路径,应该通过另一个php文件给出另一条路径,即我目前有这个下载按钮的HTML代码

<div class="button button1">
      <a href="#my link">Download</a>
      <p class="top">Click to begin</p>
      <p class="bottom">7.54 MB .RAR</p>
</div>
Run Code Online (Sandbox Code Playgroud)

我应该有类似的东西<a href="/download.php file=my link">Download</a>吗？

请帮我实现这些下载按钮的计数器.我将非常感激.谢谢.问候

Fer*_*don 6

我会在下载链接上找到一个jQuery事件监听器,并通过PHP完成服务器端的所有操作.它可能不是万无一失的,但它不会对用户产生太大影响.

如果你想做这样的事情,那么你首先需要以一种可以通过jQuery访问的方式对按钮进行分组; 还有其他方法可以在jQuery中选择多个元素,但最简单的方法是将它们作为特定类的所有成员.

然后,您可以使用.each()函数遍历该类.所以对于页面的初始化; 即使所有页面内容有效; 你需要遍历每个按钮并向PHP脚本发出一个帖子请求; 需要发送到PHP脚本的所有内容都是下载的ID.这在下面的代码的第1部分中完成.

第2部分是为发生下载时设置事件监听器.再一次,通过在整个类上放置一个事件监听器,我们可以检测到它们中的任何一个; 然后通过访问它的id来识别它来自哪个按钮.(注意:为简单起见,使标记中的id与数据库中的id相同)

这然后向php脚本发出另一个帖子请求; 但提供了一个额外的参数 - "下载".实际上,与下载相对应的值实际上并不重要; 因为这种情况很简单,用户要么下载它,要么不下载.所以在代码的PHP段(下面的下面)我们甚至都没有检查它的值; 我们只是检查它是否存在.

$(document).ready(function(){
  /* [[PART 1]]: loop through every element in the .button class*/
  $(".button").each(function (e) {

    /* get it's ID (which is equal to the download id stored in the db */
    var id = e.target.id;

    /* Post the download id to ranking.php; then echo the returned value to an 
    ** element with the id of 'count<num>'; where num is the download id. */
    $.post( 'ranking.php', { 'id' : id }, function(data){
        $('#count' + id).html(data);
    });
  });

  /* Part 2: When button is clicked, post the download data to "ranking.php" */
  $('.button').click(function(event){
      var id = e.target.id; //get the id of the button

      $.post( 'ranking.php', { 'id' : event.target.id, 'download' : 'YES' },  //set 'download'
          function(){ $('#count' + id).html(data) });   //echo new value to html
  });
});
Run Code Online (Sandbox Code Playgroud)

我建议使用jQuery,因为它提供了足够的语法糖,使事情变得非常简单.此外,通过使用jQuery - 如果您愿意,您将在未来打开通往许多可能性的大门.

服务器端是PHP接管的地方.实际上,所有这一切都需要检查是否设置了"下载",并回显下载次数.(如果设置了'download'参数,显然会使用数据库增加数字)

这可以用......之类的东西来实现.

<?php
    mysql_connect(localhost,$user,$password);
@mysql_select_db($database) or die( "Unable to select database");   

    if(! isset($_POST['id']) {
         //die error!
    }

    /* if $_POST['download'] isn't set, then just get the current download number
       and echo it back to the browser */
    if(! isset($_POST['download'] ){
        $query = sprintf('SELECT * FROM dl_table WHERE id = %d', $_POST['id']);
        mysql_query($query);
    print mysql_result($query, 0, 'download');
        exit; // no need to carry on, our job is done..
    }

    /* if the script reaches here then $_POST['download'] is set, so you need to log a 
    ** new download */
    $query = //generate query to increment the database field
?>
Run Code Online (Sandbox Code Playgroud)

对于简单的情况,上面的例子可以工作(显然数据库函数已经更正了),但显然 - 这可能不是有效的代码,因为我在晚餐时输入了它!当然,这只是为了让您了解可能的解决方案.(如果你决定做类似的话,我已经演示了不好的做法 - mysql操作应该最好用mysqli*函数或PDO完成)

查看PHP My SQL文档; 希望这能指出你正确的方向.

现在另外,正如我所知,你对jQuery并不太热衷(一旦你进入它就很棒!)你可以使用jQuery解决方案的PHP脚本.只需将$ _POST []更改为$ _GET [],并像其他答案所说的那样,使用"ranking.php？id ="这样的网址; 然而,在数据库查询完成后,您需要查看让PHP脚本传递文件.

它还留下了显示下载编号的问题; 如果没有AJAX,您将不得不在HTML标记内嵌中嵌入一些PHP.我希望我已经编辑了这个以使它更有意义,并给你一个其他选项的概述!:)

归档时间：

查看次数：

6771 次

最近记录：

13 年，4 月 前
相关归档
如何在加载页面时运行函数？ 223
在MAMP中停止PHP 5.5.3的缓存 123
从语义上讲,哪个更正确:a在h2中,还是在h2中？ 53
删除HTML滚动条但允许鼠标滚轮滚动 43
检查是否包含或加载了文件 40
如何使用变音符号生成javadoc文档？ 33
如何在.htaccess中附加到PHP的include_path的路径 31
我的OpCache在运行吗？ 31
使href(锚标记)请求POST而不是GET？ 29
如何在经典的asp中读取文本文件 5
难疑归档
提高SQLite的每秒INSERT性能？ 2880
如何删除已合并的所有Git分支？ 1782
如何检查字符串"StartsWith"是否是另一个字符串？ 1660
makefile中.PHONY的目的是什么？ 1535
Make .gitignore会忽略除少数文件之外的所有内容 1531
如何检查Bash中是否设置了变量？ 1417
我应该如何道德地接近用户密码存储以便以后的明文检索？ 1346
如何从Git存储库中删除.DS_Store文件？ 1167
查找包含具有指定名称的列的所有表 - MS SQL Server 1090
自定义HTTP标头:命名约定 1051