您当前位置: 主页 / Dog 博客 / 存档

T&C's 困境

2005年1月9日 星期日 ( 格林威治标准时间 16:38)

标记“我同意条款和条件”复选框的最佳方法是什么?

这是显而易见的方法

	<input type="checkbox" name="agree" id="agree" /><label for="agree">I have read and agree to the <a href="/termsandconditions.html">terms and conditions</a>.</label>

然而,这样做的问题是,如果用户点击“条款和条件”链接,因为该链接包含在复选框的标签中,复选框将被选中。因此,有人可能会争辩说,用户同意 T&C,因为他们只打算阅读它们,而不是同意它们。

但然后,该标签中的文本复选框的最佳标签。而将 T&C 链接放在该文本中的最明显位置。

怎么办?

评论

评论1

好吧,这肯定会令人困惑。
我的第一反应是:将复选框放在文本下方,并在旁边添加“我同意”标签。

Rimantas 在 2005 年 1 月 9 日星期日 17:23 GMT 说道。

评论2

[复选框] [标签]: [链接]
类似
<input type="checkbox" name="agree" id="agree" /><label for="agree">我已阅读并同意:</label> <a href="/termsandconditions.html">条款和条件</a>。

或者,
为什么不将法律文本显示在 IFRAME 或 overflow: auto 的 DIV 中,放在标签和复选框的上方?

Gabriel Mihalache 在 2005 年 1 月 9 日星期日 17:57 GMT 说道。

评论3

我认为你会使用你的例子,但不要使其成为链接。然后,紧随其后,放一个写着“阅读条款和条件”的链接。

Jeff 在 2005 年 1 月 9 日星期日 19:19 GMT 说道。

评论4

要么
1:不使用 label 标签
...或者
2:使用 label 标签,但添加一些 javascript 来覆盖复选框的选中状态
...或者
3:重新考虑使用使用条款,为什么需要它...

Thomas Baekdal 在 2005 年 1 月 9 日星期日 21:42 GMT 说道。

评论5

嗯,我明白了你的意思。你确实需要使用 label 标签。也许

我已阅读条款和条件,并且
我同意

如果你提供不同意选项,你最好使用单选按钮。

不确定你的评论过滤器会不会吞掉它,希望不会。

Tom 在 2005 年 1 月 9 日星期日 22:17 GMT 说道。

评论6

在选中以下项目之前,请阅读条款和条件。
我已阅读并同意条款和条件。

Neal 在 2005 年 1 月 9 日星期日 23:01 GMT 说道。

评论7

“通过选中‘我同意’,您表明您同意遵守此处列出的 <a href...>条款和条件</a>,尽管存在‘我思故我在’之类的内容。”
<br />
<label for="agree">我同意</label>”和复选框。

Dave Vogt 在 2005 年 1 月 10 日星期一 05:54 GMT 说道。

评论8

真正的问题会不会是,用户会点击链接查看 T&C,从而跳出他们正在完成的表单?也许这是极少数“iframe 的有效用途”之一?

Chris Hunt 在 2005 年 1 月 10 日星期一 17:14 GMT 说道。

评论9

“iframe 的有效用途”?它们难道不是与会飞的猪有关吗?;)

这里有一些好主意。我特别喜欢 Gabriel 的 overflow: auto 想法,这会让 T&C 像 iframe 一样工作,但更具可访问性(更不用说更容易),并且也与 Neal 的建议有些相似,例如

<p>请确保您在继续之前已阅读 <a>条款和条件</a></p>
<input type="checkbox" /><label>我已阅读并同意条款和条件</label>

Patrick 在 2005 年 1 月 10 日星期一 17:30 GMT 说道。

评论10

有趣,但你在这个页面顶部的例子在语义上是不正确的,也就是说,你使用的标记不是它应有的用途。
首先,label 仅仅是…表单控件的标签,将其与链接一起使用很可能不是有效的标记,即使它“有效”地提供了链接。其次,你缺少一个围绕 input 的“form”包装控件。你还使用了一个没有表单控件包装器和提交按钮的 input 标签,因为 input 标签需要一种方式来“提交”用户输入的表单数据。你使用的是一个 form “input”控件,对吗?如果是,那就是表单控件的目的,所以根据图示,这个规则也被违反了。最后,通过要求用户“输入”数据或勾选一个框(我注意到它默认是未选中的),然后使用链接链接到表单之外,你正在混淆用户,用户现在想知道他们输入的内容发生了什么。

所以,这里有一个解决方案:首先弄清楚你想做什么。如果你想让他们被动地阅读某样东西并转到下一页,那么一个带文本的超链接,没有表单或输入元素是很好的。如果你需要,可以创建一个图形按钮。如果你正在请求用户“输入”,那么允许他们通过复选框表单控件输入,然后添加一个提交按钮(以任何你喜欢的方式样式化),这样他们就可以提交数据,无论它是否被处理或存储。
最后,你可以将关于“同意条款和条件”的文本信息添加进去,可能在一个与 input 元素关联的 label 中,就像你做的那样,但你也可以在提交按钮的文本值中加入“我同意”。还有可能有一个额外的复选框和/或按钮,选择不同意的选项。无论选择哪条路线,都会将他们引导到不同的页面。如果用户是被动地同意他们在该页面上阅读的内容,你仍然需要决定你是要求输入并提交表单,还是链接到信息。这应该决定使用哪种标记…但“混合”类型在我看来是行不通的。

mitchell 在 2005 年 1 月 29 日星期六 09:29 GMT 说道。

评论11

不能将标签附加到一行而不是文本吗?我查阅了 phpMyAdmin 的源代码,看看他们是如何做到的,但一无所获。

Farheen 在 2005 年 10 月 9 日星期日 05:04 GMT 说道。

另请参阅

^ 顶部

SiteGround: Fast, reliable, recommended hosting.