Question

有没有人有经验在搜索结果旁边设置具有语义意义的过滤选项？我的意思是：

<ol role="filter">
<li>
    <label for=""><input type="checkbox" name="filter-by-name" value="pete"> Pete</label>
</li>

或者我应该做更多的事情：

function scroll(speed) {
$('html, body').animate({ scrollTop: $(document).height() }, speed, function() {
    $(this).animate({ scrollTop: 0 }, speed);
});
}

speed = 25000;

scroll(speed)
setInterval(function(){scroll(speed)}, speed * 2);

Answer 1

由于它们是表单控件，因此要使用语义，他们需要使用正确的标记。

基于w3.org

上的分组控件部分

<fieldset>
    <legend>I want to receive</legend>
    <div>
        <input type="checkbox" name="newsletter" id="check_1">
        <label for="check_1">The weekly newsletter</label>
    </div>
    […]
</fieldset>

你的榜样应该是：

<fieldset>
    <legend>Filter by:</legend>
    <div>
        <input type="checkbox" name="newsletter" id="pete">
        <label for="pete">Pete</label>
    </div>
    […]
</fieldset>

关于name属性，这是您的偏好，来自What is the purpose of the name attribute in a checkbox input element?上的答案

不要因为name =“checkbox”而感到困惑。它可以更合乎逻辑   be name =“drink”and type = checkbox。

在上述情况下，您有多个具有相同名称的复选框。   当多个复选框具有相同名称时，表单将发送一个组   值到请求中的服务器。注意：只有值   选中的复选框将被发送到服务器。

理想情况下，这些用于允许多项选择问题   不止一个答案是允许的。与单选按钮相反，仅限于此   选项中允许一个答案。

如何在语义html中为搜索结果设置过滤器选项

1 个答案: