Clever Geek Handbook

Content tab in IE10

I am working on an angular application where some UI elements need to be accessible by pressing the tab key, this is to gain access rights. As an example, we have content areas that open and close when you click / tap the back button on the button. I don't want the button to trigger a page refresh, so I have an empty href. The link to open / close the content area looks like this:

<a href>The link<a>

This works great in every browser, but IE10, in IE10 you cannot insert a href tab if it does not contain a value, for example

<a href="#">The link<a>

Does anyone know how to fix this issue in IE10. I know I can write some js to prevent Default actions, but I would rather not add additional js for something like this if there is other work to do.

+3


source to share


2 answers


You might want to use button

instead of a

.

An element without an attribute is a placeholder for where the link could be placed if it were relevant, consisting only of the element's content. "This doesn't seem to be what you want to convey. a

href

An element button

in a Button state would be appropriate in your case:



<button type="button">…</button>

It comes with the button

role WAI-ARIA ("A login that allows you to perform actions triggered by the user when clicked or pressed.") And is configurable by default.

+4


source


There are several ways to solve this problem:

  • Add tabindex="0"

    to anchor
  • Add href="javascript:;"

    to anchor or
  • Add href="#"

    to anchor


The advantage of the first and second options is that they do not require a call event.preventDefault()

to constantly go up page.

+2


source






More articles:


All Articles