0

我正在使用 css 和<a>带有 s 的标签组合构建一个表格，<span>例如：

<a class='header'>
  <span>User ID</span>
  <span>Name</span>
  <span></span>
</a>
<a href='somesite.php'>
  <span>7</span>
  <span>Ofek</span>
  <span><button type="button" onclick="somefunc()">Add to Favourites</button></span>
</a>

结果看起来像这样：

在此处输入图像描述

现在我的问题是，当我单击按钮时，我仍然被重定向到 somesite.php，并且函数 somefunc() 永远不会被调用，我在某处看到按钮不能嵌套在跨度内，所以有什么替代方法可以使这项工作? 我希望每当用户单击该行时，它会将他重定向到 somesite.php，但不是当他按下按钮时，然后我只希望调用 func somefunc()。

4

3 回答 3

3

button在元素中嵌套a元素会在处理事件时产生问题，并且在 HTML5 CR 中是禁止的。

避免产生问题的简单方法是将交互元素分开：

<a href='somesite.php'>
  <span>7</span>
  <span>Ofek</span>
</a>
  <span><button type="button" onclick="somefunc()">Add to Favourites</button></span>

这在您使用标记的逻辑方法中是不可能的（因此）table，但是如果您使用 CSS 模拟表格以便单元格是span元素（或者，通常是短语/内联/文本级元素），这很简单。

于 2013-10-06T18:18:24.517 回答
1

只需添加return false到您的somefunc()代码：

function someFunc () {
    // your existent code
    return false;
}

并在 HTML 中onclick="return somefunc()"。但我也建议不要使用onclickHTML 属性，而是使用：

$("button").on("click", function (e) {
    e.preventDefault;
    somefunc();
    return false;
});

在此处阅读有关此主题的信息。

于 2013-10-06T17:41:56.380 回答
0

您可以将点击事件绑定到按钮，然后使用preventDefault()：

JS

function somefunc(e){
    e.preventDefault();
    alert("hey");
}
document.getElementById('abc').addEventListener(
    'click', somefunc, false
);

工作小提琴

http://jsfiddle.net/KRVUv/1/

于 2013-10-06T17:44:11.687 回答