Question

我试图通过PHP和mySql从我的数据库中读取业务列表。找到我要展示的业务后，我想在他们自己的“clickDiv”中连续列出它们（这部分我已经有了工作）。这个“clickDiv”应该可以点击jQuery slideToggle并显示每个商家的正文信息，我目前在id = revealPara里面。

我希望将点击记录为Google Analytics（分析）作为事件，商家名称或“$ row ['name']”。

我试图以谷歌的方式解决这个问题，但到目前为止，我只得到了toggleSlide来处理列出的第一个“clickDiv”，而不是以下的业务。就分析部分而言，我无处可去。

以下是我成功构建列表的当前代码。

//select all businesses
///////////////////////

$sql = "SELECT * 
FROM businesses"

$result = mysql_query($sql)
or die('Query failed. ' . mysql_error());

while($row = mysql_fetch_array($result)) {          
?>

//list businesses
/////////////////

<div id="clickDiv" class="row-fluid" style="background-color:#333333;">
<div class="span4" style="padding:0; margin:0; text-align:center; margin:0 auto;"><img height="75px" width="75px" src="../img/logos/<?php echo $row['logo'];?>"></div>
<div class="span4"><h2 style="color:#01a7c6; padding-top:0px; margin:0;"><?php echo $row['name'];?></h2><p style="text-align:center; padding-top:5px; margin:0"><?php echo $row['address']?></p><p id="revealPara<?php echo $row['id'];?>" style="text-align:center; padding:50px 0"><?php echo $row['body'];?></div>
<div class="span4"><h2><i class="icon-sort-down" style="color:#01a7c6; font-size:1em; padding-right:10px; margin-bottom:0px 0px;"></i></h2></div>
</div>
}

<!-- slide toggle -->
<script> 
$(document).ready(function(){
  $(".clickDiv").click(function(){
    $("#revealPara").slideToggle("slow");
  });
});
</script>

Answer 1

对于事件跟踪，以下是一个示例。

<!-- slide toggle -->
<script> 
$(document).ready(function(){
  $("#clickDiv").click(function(){
    $("#revealPara").slideToggle("slow");
_gaq.push(['_trackEvent', 'Videos', 'Play', 'Gone With the Wind']); // edit this
  });
});
</script>

参考：https://developers.google.com/analytics/devguides/collection/gajs/eventTrackerGuide#SettingUpEventTracking

Answer 2

从技术上讲，您的元素应该只有唯一的ID。您的编码设置方式，每个企业都会有一个ID为＆＃34; clickDiv＆＃34;。

其次，当使用jQuery选择ID时，它只返回一个，因为它只期望找到一个，所以你不会让一个组返回。如果你真的想要保持所有这些元素（非语义）的id相同，你可以使用$（＆＃39; div [id =＆＃34; clickDiv＆＃34;]＆＃39;），将返回所有这些项目，你滑块将工作。

我建议使用＆＃34; clickDiv＆＃34;的类名。对于每个项目，并通过使用变量创建每个项目唯一的ID（即.- clickDiv1，＃clickDiv2等），并在每次while循环运行时将其递增1。

Answer 3

您的示例中有一个div关闭标签错误和语法错误。

<div id="clickDiv" class="row-fluid" style="background-color:#333333;">

     <div class="span4" style="padding:0; margin:0; text-align:center; margin:0 auto;"><img height="75px" width="75px" src="../img/logos/<?php echo $row['logo'];?>">
      </div>

      <div class="span4"><h2 style="color:#01a7c6; padding-top:0px; margin:0;"><p style="text-align:center; padding-top:5px; margin:0"><?php echo $row['address']?></p><p id="revealPara" style="        text-align:center; padding:50px 0"><?php echo $row['body'];?>
      </div>

      <div class="span4"><h2><i class="icon-sort-down" style="color:#01a7c6; font-size:1em; padding-right:10px; margin-bottom:0px 0px;"></i></h2>
      </div>
</div>

创建动态jQuery slideToggle div，用于跟踪谷歌分析的点击次数

3 个答案: