尝试将按钮放入 link

Question

我有一个可点击的跨度，其中有一个按钮。我希望 span 转到一个 href，按钮转到另一个。这是我目前拥有的代码：

<script>
function deleteAlbum(url) {
    var txt;
    var r = confirm("Do you really want to delete this album?");
    if (r == true) {
        window.location.href = url;
    } 
    document.getElementById("demo").innerHTML = txt;
}
</script>    

<a href='gallery.php?album=16022015NewTest'>
    <span class='album'>
        <p>New Test</p>
        <p>16/02/2015</p>
        <button class='delete' onClick=deleteAlbum('gallery.php?delete_album=16022015NewTest')>
            Delete Album
        </button>
    </span>
</a>

有人有什么想法吗？

Answer 1

根据 atmd 的评论重组您的 html：不要将 button 放在 a 中。要 html 符合属性值使用引号：

<div class="album">
    <a href="gallery.php?album=16022015NewTest">
        <p>New Test</p>
        <p>16/02/2015</p>
    </a>
    <button class="delete" onClick="deleteAlbum('gallery.php?delete_album=16022015NewTest')">Delete Album</button>
</div>

因此 a 标签不包含 button 标签。在内联元素中不要有块元素也是一个好主意。 span 标签已更改为 div 标签。您也可以将 p 标签更改为 span。然后 html 看起来像这样：

<div class="album">
    <a href="gallery.php?album=16022015NewTest">
        <span>New Test</span>
        <span>16/02/2015</span>
    </a>
    <button class="delete" onClick="deleteAlbum('gallery.php?delete_album=16022015NewTest')">Delete Album</button>
</div>

Answer 2

您想继续阅读 event bubbling - 该答案中的 quirksmode 解释非常好。

以下是您的示例的一种可能修复方法：

<script>
function gotoAlbum(albumId) {
  window.location.href="gallery.php?album="+albumId;
}

function deleteAlbum(e, url) {
  var r = confirm("Do you really want to delete this album?");
  if (r == true) {
    window.location.href = url;
  } 
 e.stopPropagation();
}
</script>    


<span class='album' onClick="gotoAlbum('16022015NewTest');" >
  <p>New Test</p>
  <p>16/02/2015</p>
  <button class='delete' onClick="deleteAlbum(event, 'gallery.php?delete_album=16022015NewTest');">Delete Album</button>
</span>

另外：正如其他评论所提到的，锚点内的按钮很奇怪 - 它不合规 HTML5 - 参见 this question

Answer 3

你不知道。不要把 <button> 放在 <a>.

里面

尝试将按钮放入 link

Trying to put a button into a link

html

button