Làm thế nào để làm cho (liên kết) nút chức năng như siêu liên kết?

Question

Tôi làm cách nào để sử dụng asp:Button hoặc asp:LinkButton làm asp:Hyperlink?

Các Hyperlink hiện chỉ đi vào phần khác trên cùng một trang: NavigateUrl="#Section2"

Tôi muốn làm điều này trong file aspx mà không cần mã hóa bổ sung. Cảm ơn.

Mục đích là để có một nút nhìn thay vì văn bản được gạch chân NHƯNG Tôi không muốn sử dụng hình ảnh có siêu liên kết để đạt được mục đích này.

Answer 1

Bạn có thể sử dụng sự kiện OnClientClick để gọi một hàm JavaScript:

<asp:Button ID="Button1" runat="server" Text="Button" onclientclick='redirect()' /> 

mã JavaScript:

function redirect() { 
    location.href = 'page.aspx'; 
} 

Nhưng tôi nghĩ rằng tốt nhất là nên phong cách một siêu liên kết với css.

Ví dụ:

.button { 
    display: block; 
    height: 25px; 
    background: #f1f1f1; 
    padding: 10px; 
    text-align: center; 
    border-radius: 5px; 
    border: 1px solid #e1e1e2; 
    color: #000; 
    font-weight: bold; 
} 

Answer 2

Có một con đường trung đạo. Nếu bạn muốn một điều khiển HTML nhưng bạn cần phải truy cập vào máy chủ bên nó, bạn chỉ có thể thêm runat="server" thuộc tính:

<a runat="server" Id="lnkBack">Back</a> 

Sau đó bạn có thể thay đổi phụ href máy chủ sử dụng Attributes

protected void Page_Load(object sender, EventArgs e) 
{ 
    if (!IsPostBack) 
    { 
     lnkBack.Attributes.Add("href", url); 
    } 
} 

kết quả là:

<a id="ctl00_ctl00_mainContentPlaceHolder_contentPlaceHolder_lnkBack" 
     href="url.aspx">Back</a> 

Answer 3

Cách tốt nhất để thực hiện việc này là chỉ cần thêm "href" vào nút liên kết như dưới đây.

<asp:LinkButton runat="server" id="SomeLinkButton" href="url" CssClass="btn btn-primary btn-sm">Button Text</asp:LinkButton> 

Sử dụng javascript hoặc thực hiện lập trình này trong page_load, cũng sẽ hoạt động nhưng không phải là cách tốt nhất để thực hiện việc này.

Bạn sẽ nhận được kết quả này:

<a id="MainContent_ctl00_SomeLinkButton" class="btn btn-primary btn-sm" href="url" href="javascript:__doPostBack(&#39;ctl00$MainContent$ctl00$lSomeLinkButton&#39;,&#39;&#39;)">Button Text</a> 

Bạn cũng có thể nhận được kết quả tương tự bằng cách sử dụng sử dụng thường xuyên <a href="" class=""></a>.