Menu
I'm implementing item selection functionality in javascript (using jQuery). item is a li that contains some html.
the user can click on one item (makes it selected) and then shift-click on another item to select all the items in between. this basically works OK, however the shift-click also selects (higtlights) the text that appears inside the items (the basic browser functionality for shift clicks). is there any way to disable this?
534
You can use the user-select property to disable text selection of an element. In web browsers, if you double-click on some text it will be selected/highlighted. This property can be used to prevent this.
You'll need to call event. preventDefault() in both the down and move events in order to keep the browser from selecting text. Save this answer.
To disable the text selection highlighting in React, we can set the css property user-select to a value “none”. In the example above, we have added the browser prefixes for the user-select property, so it works the same in all browsers.
Try a combo of JavaScript and css to prevent the selection in the first place:
$('li').attr('unselectable', 'on'); // IE css (for browsers not IE):
li { user-select: none; /* CSS3 (little to no support) */ -ms-user-select: none; /* IE 10+ */ -moz-user-select: none; /* Gecko (Firefox) */ -webkit-user-select: none; /* Webkit (Safari, Chrome) */ } If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
