Question

我从显示约会的移动应用网页获得零星的行为。实际的约会是动态创建的div标签div标签的正确长度，宽度和位于包含块的溢出：auto; position：relative，这样我就可以计算出他们在页面上相对于预定时间的位置。通过单击特定约会框，将显示该约会的某些详细信息。

现在，一切都很好，单击约会适用于所有约会，这些约会出现在包含块的顶部2/3左右，但是在点击时，下部没有响应，除非你滚动显示（甚至是最轻微的动作就可以做到这一点）然后那些之前没有反应的约会现在完美无缺。

关于我应该从哪里开始寻找的任何线索？

以下是一些代码，它是在Ajax调用中用于显示页面的PHP页面的摘录（因此，回显语句）：

$ht = screen_useable_height(310, 0);
echo '<div id="appointments" style="width:'.screen_useable_width(57, 600).'px;height:'.$ht.'px">';
// Create the Time of Day column from the DRAW TABLE ARRAY LOAD FROM TH DATA BASE       
echo '<table align="left" border="0" cellspacing="0">';
    $rnddiv = "-1";
    $rndx = "x";
    for ($i=0; $i<$timecnt; $i++) {
        // check if div header
        $flag = 0;
        for($j = 0; $j<$drawcnt; $j++) {
            if($divno[$j] == $divtime[$i]) {
                if($type[$j] <> "B") { //set for booking if this header is a doublebook open
                    $flag = 1; // This div is a header
                    break;
                 }
             }
        }
        if($flag == 0) { // link to client lookup or Options base on whether header or body
            $link = 'appt_book_new.php?apdate='.$yyyymmdd.'&aptime='.$divtime[$i];
        } else {
            $link = 'appt_options.php?recno='.$recno[$j];
        }
        echo '<tr>';
            if($i== $timecnt-1) { // user rounded corners if top time division
                echo '<td class="tmspace">&nbsp;</td><td><div class="timedetail_rnd"><a href="'.$link.'" class="fill-div">'.$timetext[$i].'</a></div></td>';
                $rnddiv = $i;
            } else {
                echo '<td class="tmspace">&nbsp;</td><td><div class="timedetail"><a href="'.$link.'" class="fill-div">'.$timetext[$i].'</a></div></td>';
            }
        echo '</tr>';
    }
echo '</table>';
//create the appointment boxes                              
echo '<table align="left" border="0" cellspacing="0"><tr><td>';
    $ht = ($cell_ht*$timecnt)-2; // this is height of Time column above. Subtract bottom border
    $wd = screen_useable_width(120, 600); // based on screen size of device being used
    echo '<div class="white_background" style="position: relative">'; //Containing Block
        $cnt = scale_5min($timecnt, $viewflag); // User may scale time division in 5, 10, 15 20, 30 and 60 minute intervals
        for($j=0; $j<$timecnt; $j++) { // create underlining blank spaces which can be clicked to begin booking process. The will be covered up by existing appointments.
            $topoffset = ($j * ($cell_ht-2))-1; 
            $boxht = ($cell_ht-2) -2;   
            $left = 0;
            echo '<div class="boxborder white_background" style="width:'.$wd.'px;height:'.$boxht.'px;position:absolute;top:'.$topoffset.'px;left:'.$left.'px"><a href="appt_book_new.php?apdate='.$yyyymmdd.'&aptime='.$divtime[$j].'" class="fill-div"><div class="appt_client_sv">&nbsp;&nbsp;&nbsp;</div></a></div>';
        }
        for($i = 0; $i<$drawcnt; $i++) { // Now draw previously booked appointments
            $topoffset = (scale_len(($divno[$i] - $startdiv), $viewflag) * ($cell_ht-2))-1;
            $wd = screen_useable_width(120, 600)-1; // width depending on device used
            $boxht = ($cell_ht-2)* scale_len($length[$i],$viewflag) -2;
            $sv = strtoupper(service_name($svno[$i]));
            if($clientno[$i] > 0) {
                $clname = client_name($clientno[$i]).",";
            } else {
                $clname = "";   
            }
            $left = 0;
            if($layer[$i] > 1) { // offset if appointment overlaps another
                $wd = $wd - (($layer[$i]-1)*50);
                $left = ($layer[$i]-1)*50;  
            }
            if($type[$i] == "F") { 
                $sv = "Finish"; 
            } else {
                if(($type[$i] <> "D") && ($type[$i] <> "D") && ($type[$i] <> "K")) {
                    $income = $income + service_price($svno[$i]);
                }
            }
            if($type[$i] == "B") {
                echo '<div class="boxborder svcolord'.$gpno[$i].'" style=width:'.$wd.'px;height:'.$boxht.'px;position:absolute;top:'.$topoffset.'px;left:'.$left.'px"><div class="appt_client_sv"><strong>'.strtoupper($clname).' Processing</strong></div></div>'; 
            } else {
                echo '<div class="boxborder svcolor'.$gpno[$i].'" style=width:'.$wd.'px;height:'.$boxht.'px;position:absolute;top:'.$topoffset.'px;left:'.$left.'px;z-index: 10000"><a href="appt_options.php?recno='.$recno[$i].'" class="fill-div"><div class="appt_client_sv"><strong>'.strtoupper($clname).' '.$sv.'</strong></div></a></div>';
            }
        }
    echo '</div>';
echo '</div></td></tr></table>';
echo '</div>';

Answer 1

检查DOM，z-index，低不透明度元素等的结构。
是否有任何事件处理程序绑定到可能导致布局更新的页面的scroll事件。
作为调试练习，请尝试将单击处理程序附加到将目标元素记录到控制台的文档中。单击您的div并查看报告的元素是否为点击。

在文档的末尾添加这样的内容或在控制台中执行。

document.addEventListener('click', function(event){ console.log(event.target); });

div标签的零星响应

1 个答案: