HTML按鈕不工作，在Chrome和Firefox

Question

我的設計，我想我的html頁面上使用自定義按鈕工作錯誤的，但它沒有工作

<a href="@Url.Action("AddCategories/" + Model.Id, "test")"> 
     <button type="button"> 
      <a href="#" id="" class="btn">Add new things here</a> 
     </button> 
    </a>​ 

這裏是校驗碼http://jsfiddle.net/YGCWZ/

請有人可以幫助我做到這一點。我有另一件事情，Firefox和鉻都做錯了。

<a href="/test/AddCategories/1">dfdsf 
     </a> 
<button type="button"><a href="/test/AddCategories/1"> 
      </a><a href="#" id="" class="btn">Add new things here</a> 
     </button> 

有人可以幫我找出做這個鏈接的方法。

感謝

Answer 1

的HTML5 button元素不應該有一個像href一個錨鏈接。它用於從表單或獨立按鈕提交數據，而不是用作鏈接。

如果你只是爲了外觀而使用一個按鈕，我會堅持這樣簡單的東西，並自己在CSS中設計它。

<a class="button" href="somewhere.html">My Link</a> 

如果你需要一些JavaScript在那裏，那麼一個事件將它綁定在你的框架（如jQuery的），或者直接運行的功能，其中myFunc應該返回false避免默認的鏈接行爲：

<a class="button" href="javascript:myFunc();">My Link</a> 

如果您使用form中的按鈕，則應該使用onclick屬性。另外，我不認爲你應該嵌套錨標籤。

編輯：

對於造型，你可以通過添加背景圖片等等戰果：

<style> 
* { 
    margin: 0; 
    padding: 0; 
} 
.button { 
    font: bold 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; 
    text-decoration: none; 
    background: blue; 
    color: white; 
    padding: 5px 10px; 
    margin: 5px 5px; 
    display: inline-block; 
} 
</style>