html - 标签内的复选框输入只会更改检查状态而不会打开链接

Question

我正在尝试更改 squirrelmail GUI，以便它可以更轻松地与平板电脑一起使用。我几乎已经对所有内容进行了排序，除了我在 <a> 中有一个复选框。单击复选框时我不想打开链接的标记。

都在<li>里面这样整行都可以点击打开光标下的邮件。

下面是代码，这是我目前所拥有的链接，它适用于我想做的事情，除了复选框:

http://jsfiddle.net/YEpuf/1/

    <li>
    <a href="read_body.php?account=0&amp;mailbox=INBOX&amp;passed_id=93&amp;startMessage=1"><dl>
    <dt class="col_check"><input type="checkbox" name="msg[0]" id="mbx_1_msg0" value="93"  onclick=""/></dt>
    <dd class="col_from" >name@domain.com</dd>
    <dd class="col_date">Sep 9, 2012</dd>
    <dd class="col_flag"><img src="../images/themes/outlook/msg_read.png" alt="R" title="(Read)" /></dd>
    <dd class="col_flagx"><img src="../images/themes/outlook/attach.png" alt="A" title="Attachment" /></dd>
    <dd class="col_flagx"><img src="../images/themes/outlook/transparent.png" alt="!" title="Normal priority" width="5" /></dd>
    <dd class="col_subject" >Re:&#32;test&#32;email&#32;36</dd>
    </dl></a></li>

我用过<dd>因为我发现让元素在 cols 中排列很容易，但尝试了 <span>和 <div>在<li>里面但行高有问题。但也许有更好的方法，所以任何建议/建议都会很好。

编辑:我刚刚在 IE 和 Chrome 中尝试了我的代码，它工作正常，所以看起来这是 FF 的问题。无论如何仍在寻找答案!!

Answer 1

简单(且正确)的答案是:在您的 a 元素中不要有复选框。 错误 答案恕我直言，但仍然可能是一个答案是使用 javascript 来防止事件冒泡:

https://developer.mozilla.org/en-US/docs/DOM/event.stopPropagation