Question

前一段时间，你们在this page的this forum post上帮助我解决了网页跳转问题。我将指的是“客户端”下的样式复选框。好一会儿，我只是在更换容器上设置了最小高度，然后它阻止了页面跳转，但不再这样做（原因不明）。好吧，我继续把window.scrollTo（0,1400）放在我的函数中，但是它没有正确地将样式的复选框放在IE上，所以现在我回过头来试图找出页面跳转的原因。

最奇怪的是，即使您禁用了javascript（在Chrome开发人员工具设置中然后刷新），单击其中一个样式化复选框时页面也会跳转。 为什么关闭javascript的复选框会导致页面跳转？

Answer 1

我快速查看了您的源代码我无法弄清楚为什么每次点击都使用json提取数据？客户是否改变了LIVE？

我的意思是您可以在不使用Get Json或任何类型的实时查询的情况下列出所有客户端，然后为相关的相关垂直添加一个类。

例如，服务和医疗保健，

<强> CSS

#verticals li{
    float:left;
    list-style:none;
    background-color: #97ceff;
    color: black;
    border-radius:2px; 
    margin-right:10px;
    padding:5px 10px;
    cursor:pointer;
}
#verticals li.activevertical{
    background-color: #2f7fc7;
    color: #fff;
}

html输出

 <!-- list verticals options !-->
    <ul id="verticals">
       <li id="service">Services</li>
       <li id="healthcare">Healthcare</li>
    </ul>
<div style="clear:both"></div>
    <ul id="customers" class="">
       <!-- Add filter class here in the <li> add filter_ before vertical kind !-->
           <li class="filter_service">Ecova</li>
           <li class="filter_service">HP</li>
           <li class="filter_service">Gartner</li>
           <li class="filter_healthcare">Henry Schein</li>
           <li class="filter_healthcare">GE Healthcare</li>
           <li class="filter_healthcare">BerylHealth</li>
    <!-- and if a vertical can be in two categories add both vertical classes !-->
           <li class="filter_healthcare filter_service">BerylHealth Show in Service and Healthcare</li>
    </ul>

jQuery ：非常简短的版本

jQuery(document).ready(function($){
    $("#verticals li").on('click', function(){
        var filterli  = ".filter_"+$(this).attr("id");
        $("#customers li").hide();
        $("#verticals li").removeClass('activevertical');
        $(this).addClass('activevertical');
        $(filterli).show();
    });
});

在JSFiddle

查看

禁用javascript的页面跳转复选框点击事件

1 个答案: