You do not have permission to view the full content of this post.
Log in or register now.
I would like to create an HTML button that acts like a link. So, when you click the button, it redirects to a page. I would like it to be as accessible as possible.
I would also like it so there aren't any extra characters, or parameters in the URL.
How can I achieve this?
Based on the answers posted so far, I am currently doing this:
<form method="get" action="/page2">
<button type="submit">Continue</button>
</form>
but the problem with this is that in You do not have permission to view the full content of this post. Log in or register now. and You do not have permission to view the full content of this post. Log in or register now., it adds a question mark character to the end of the URL. I need to find a solution that doesn't add any characters to the end of the URL.
There are two other solutions to this: using JavaScript or styling a link to look like a button.
Using JavaScript:
<button onclick="window.location.href='/page2'">Continue</button>
But this obviously requires JavaScript, and for that reason it is less accessible to screen readers. The point of a link is to go to another page. So trying to make a button act like a link is the wrong solution. My suggestion is that you should use a link and You do not have permission to view the full content of this post. Log in or register now..
<a href="/link/to/page2">Continue</a>
You do not have permission to view the full content of this post. Log in or register now. You do not have permission to view the full content of this post. Log in or register now. You do not have permission to view the full content of this post. Log in or register now. You do not have permission to view the full content of this post. Log in or register now.
You do not have permission to view the full content of this post. Log in or register now.You do not have permission to view the full content of this post. Log in or register now.
You do not have permission to view the full content of this post. Log in or register now.
#css
<a href="You do not have permission to view the full content of this post. Log in or register now." class="button">Go to Google</a>
a.button {
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
text-decoration: none;
color: initial;
}
Or pick one of those many CSS libraries like You do not have permission to view the full content of this post. Log in or register now..
<a href="You do not have permission to view the full content of this post. Log in or register now." class="btn btn-default">Go to Google</a>
JavaScript
If JavaScript is allowed, set the window.location.href.
<input type="button" onclick="location.href='You do not have permission to view the full content of this post. Log in or register now." value="Go to Google" />
You do not have permission to view the full content of this post. Log in or register now.You do not have permission to view the full content of this post. Log in or register now.
You do not have permission to view the full content of this post. Log in or register now.
You do not have permission to view the full content of this post. Log in or register now. framework to format any of the following common HTML type links/buttons to appear as a button. Please note the visual differences between version 2 and 3 of the framework:
<a class="btn" href="">Link</a>
<button class="btn" type="submit">Button</button>
<input class="btn" type="button" value="Input">
<input class="btn" type="submit" value="Submit">
You do not have permission to view the full content of this post. Log in or register now. sample appearance:
You do not have permission to view the full content of this post. Log in or register now. sample appearance:
I would like to create an HTML button that acts like a link. So, when you click the button, it redirects to a page. I would like it to be as accessible as possible.
I would also like it so there aren't any extra characters, or parameters in the URL.
How can I achieve this?
Based on the answers posted so far, I am currently doing this:
<form method="get" action="/page2">
<button type="submit">Continue</button>
</form>
but the problem with this is that in You do not have permission to view the full content of this post. Log in or register now. and You do not have permission to view the full content of this post. Log in or register now., it adds a question mark character to the end of the URL. I need to find a solution that doesn't add any characters to the end of the URL.
There are two other solutions to this: using JavaScript or styling a link to look like a button.
Using JavaScript:
<button onclick="window.location.href='/page2'">Continue</button>
But this obviously requires JavaScript, and for that reason it is less accessible to screen readers. The point of a link is to go to another page. So trying to make a button act like a link is the wrong solution. My suggestion is that you should use a link and You do not have permission to view the full content of this post. Log in or register now..
<a href="/link/to/page2">Continue</a>
You do not have permission to view the full content of this post. Log in or register now. You do not have permission to view the full content of this post. Log in or register now. You do not have permission to view the full content of this post. Log in or register now. You do not have permission to view the full content of this post. Log in or register now.
You do not have permission to view the full content of this post. Log in or register now.You do not have permission to view the full content of this post. Log in or register now.
You do not have permission to view the full content of this post. Log in or register now.
#css
<a href="You do not have permission to view the full content of this post. Log in or register now." class="button">Go to Google</a>
a.button {
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
text-decoration: none;
color: initial;
}
Or pick one of those many CSS libraries like You do not have permission to view the full content of this post. Log in or register now..
<a href="You do not have permission to view the full content of this post. Log in or register now." class="btn btn-default">Go to Google</a>
JavaScript
If JavaScript is allowed, set the window.location.href.
<input type="button" onclick="location.href='You do not have permission to view the full content of this post. Log in or register now." value="Go to Google" />
You do not have permission to view the full content of this post. Log in or register now.You do not have permission to view the full content of this post. Log in or register now.
You do not have permission to view the full content of this post. Log in or register now.
You do not have permission to view the full content of this post. Log in or register now. framework to format any of the following common HTML type links/buttons to appear as a button. Please note the visual differences between version 2 and 3 of the framework:
<a class="btn" href="">Link</a>
<button class="btn" type="submit">Button</button>
<input class="btn" type="button" value="Input">
<input class="btn" type="submit" value="Submit">
You do not have permission to view the full content of this post. Log in or register now. sample appearance:
You do not have permission to view the full content of this post. Log in or register now. sample appearance:
Attachments
-
You do not have permission to view the full content of this post. Log in or register now.