0

我有一个用 PHP 回显的 HTML 表:

echo '<tr class="notfirst" style="cursor:pointer;" onclick="document.location=\'editinvoice.php?seq='.$result["sequence"].'&inv='.$result["invoice_number"].'\'">
                <td width="20"><input type="checkbox" name="check'.$counter.'" id="check'.$counter.'" onclick=\'add('.$total.', this);\' /></td>
                <td width="150">'.$result["invoice_number"].'</td>
                <td width="250">'.$company.'</td>
                <td width="100">'.$date.'</td>
                <td width="100">&pound;'.$result["total"].'</td>
                <td width="100">&pound;'.$result["total"].'</td>
            </tr>';

因此,当您将鼠标悬停在它上面时,它会突出显示整行,无论您单击该行,它都会打开链接,但是当我选中复选框时,它也会打开链接 - 我想停止这个

4

2 回答 2

1

我认为最好将您的 javascriptcode 与 html 标记分开。这样你就可以更好地控制它。

看看 javascript 中的冒泡阶段。并查看preventdefault 我希望这会有所帮助

于 2013-06-28T08:16:33.997 回答
0

我会用event.stopPropagation()

这是一个 jQuery 版本,因为它更容易执行,但如果必须,您可以在 DOM 访问中重写它。如果这样做,还需要event.cancelBubble=true为 IE<9添加

$(function() {
  $(".notfirst").on("click",function() {
    location = "editinvoice.php?seq="+$(this).data("seq")+"&inv="+$(this).data("inv");
  });
  $("checkbox[name^=check]).on("click",function(event) {
    event.stopPropagation();
    add($(this).data("total");
  });
});

使用此代码:

echo '<tr class="notfirst" style="cursor:pointer;" data-seq="'.$result["sequence"].'" data-inv="'.$result["invoice_number"].'">
  <td width="20"><input type="checkbox" name="check'.$counter.'" id="check'.$counter.'" data-total="'.$total.'" /></td>
            <td width="150">'.$result["invoice_number"].'</td>
            <td width="250">'.$company.'</td>
            <td width="100">'.$date.'</td>
            <td width="100">&pound;'.$result["total"].'</td>
            <td width="100">&pound;'.$result["total"].'</td>
        </tr>';
于 2013-06-28T08:27:45.843 回答