pointer-events: none not working in IE

11,400

pointer-events is not supported in IE 10 and there is no other similar CSS property.

Either a change in your markup or using a script is needed to solve that.

Update

Here is a sample using script.

I also styled the link so one can't see them as links, which actually could be used alone, based on if someone randomly clicks in the text and accidentally hits one, it would still be okay.

Array.prototype.slice.call(document.querySelectorAll("a")).forEach(function(link) {
  link.addEventListener("click", function(e) {  
    e.preventDefault();
  });
});

a {
  cursor: text;
  text-decoration: none;
  color: inherit;
}

Some text with <a href="http://stackoverflow.com"> a link </a> to click on

Update 2

Here is actually 2 posts that has a several ways of how this might be done (all script though but one),

where this answer doesn't use script.

Update 3 based on comment

To use the attribute disabled='disabled' one either need to add it server side so the anchor looks like this, <a href="link" disabled="disabled">Link</a>, or client side with a script like this

Array.prototype.slice.call(document.querySelectorAll("a")).forEach(function(link) {

  link.setAttribute('disabled', 'disabled');

});

/*
a {
  cursor: text;
  text-decoration: none;
  color: inherit;
}
*/

Some text with <a href="http://stackoverflow.com"> a link </a> to click on

11,400

Revenant_01

Updated on June 16, 2022

Comments

Revenant_01 almost 2 years

I'm trying to disable the hyperlinks in my SharePoint 2013 list edit page. I used a content editor webpart and put pointer-events : none. It works fine on Google Chrome but doesn't work in IE . Is there any alternative to this? I just want the CSS alternative. My IE is version 10.
- Asons about 8 years
  
  Possible duplicate of css 'pointer-events' property alternative for IE
Revenant_01 about 8 years

do you know any script for this @LGSon
Asons about 8 years

@Revenant_01 Updated my answer with a sample
Asons about 8 years

@Revenant_01 Made a small update again ... and now you can both accept and vote on answers :)
Revenant_01 about 8 years

i tried using that script in my content editor webpart , but its not working
Asons about 8 years

@Revenant_01 Make sure the script runs in the end of your body or in the onload/dom ready event.
Revenant_01 about 8 years

yes . it loads in the pageload . u r sure there is no way we can not do it with CSS .
Asons about 8 years

@Revenant_01 As we speak I'm testing another way. Will update my answer again soon if it works, or comment if not.
Asons about 8 years

@Revenant_01 Didn't work what I tried, updated my answer with a couple of links, all (but one) uses script though.
Revenant_01 about 8 years

i think [disabled] should work here . but my question here is how i can use it with the class . the class name is '.ms-formbody' . and i tried doing .ms-formbody[disabled]{}; but it doesnt seem to work.
Asons about 8 years

@Revenant_01 Added a 3:rd update for you, explaining that.