【问题标题】:Decrease product number counter on button click单击按钮时减少产品编号计数器
【发布时间】:2014-10-04 15:49:55
【问题描述】:

我的网站提供有限的折扣优惠,我想通过每次点击“注册”按钮时都会减少的计数器实时显示剩余位置的数量。

例如,我想要一个从“10”开始的简单计数器,每次单击“注册”按钮时它都会减少“1”(并在“0”处停止)。

我只想成为段落的一部分的计数器,如下所示:

<p>10 spots remaining at Current Price.</p>

触发按钮当前显示如下:

<div id="link_2"><a class="signup" href="#">Sign up</a></div>

我完全不知道该怎么做,如果这是最好的选择,我的网站可以使用 php。

谢谢! 捏捏

【问题讨论】:

  • 您将需要一个数据库来存储剩余的点数,并且每次单击注册按钮时都必须使用 php 来减少计数器
  • 如果你想让它为网站的所有访问者实时工作,你需要有一个数据库,将数量存储在其中,并使用 ajax 和 php(或任何其他服务器端语言)以减少数量
  • 使用反向逻辑以 Stack stackoverflow.com/q/22926882 上的问答为基础。你也可以谷歌“mysqli 数据库计数器 ajax”。这是一个太宽泛的主题,尤其是当您还没有代码时。我知道您不知道从哪里开始,但 Google 始终是“一个”不错的起点。

标签: php jquery html counter


【解决方案1】:

您可以用来实现所需的方法之一是使用数据库来存储可用点并相应地更新。

您可以为可用的点创建一个数据库表。

使 html 注册代码成为提交而不是类(如果您只想使用 php)或者您可以使用 javascript 或 jQuery 在单击时充当提交(onclick),您可以在此处找到主题/教程:@ 987654321@

然后是这样的代码:

if(isset($_POST['name_of_submit_button'])) {
    // Set query to update accordingly
    $query = "UPDATE available_spots_table
          SET available_spot = available_spot - 1
          WHERE id = 1"; // You can use ID to identify the 
    // Run the query
    $run_query = mysql_query($query);

    // Some other code here
 }

您可以通过从 mysql 等数据库中提取数据并在需要时使用 php 甚至 javascript 来显示它。

//PHP:
$remaining_spots = '';
$query = "SELECT available_spots FROM available_spots_table WHERE id = 1"; // Select the number of available spots
// Run the query
$run_query = mysql_query($query);

if(@mysql_num_rows($run_query) > 0){  // If query is succesful
  $result = mysql_fetch_array($run_query);  // Get results
  $remaining_spots = $result['available_spots'];  // Assign result into the variable that you will use to display
} else {
   // return fail message
}
$spots_remaining
//HTML : 
<p><?php $remaining_spots ?> spots remaining at Current Price.</p>

此代码示例只是为了演示如何实现它。但是,还有其他一些事情需要考虑,例如:当用户单击注册时,您可能需要设置一个代码来验证用户是否在更新 available_spots_record 之前进行了注册。此外,由于 php 在显示之前会处理整个页面,因此您必须使用 javascript/jQuery 来实时显示它。该过程还使用过程 mysql 进行了演示,您可能想考虑类似面向对象的 php/mysqli 或使用 mysqli = LINK。最后,您还可以创建函数来简化此过程。

谢谢。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-06-10
    • 2010-10-03
    • 2014-05-04
    • 2017-11-13
    • 2011-07-20
    • 1970-01-01
    相关资源
    最近更新 更多