How to achieve unclickable elements in jquery

Jquery method to implement unclickable elements: first add a button tag, a div tag and an anchor tag; then implement it through the "$(this).attr("disabled", "disabled");" method Just specify that the tag is disabled.

The operating environment of this tutorial: windows7 system, jquery1.10.0 version, Dell G3 computer.

Recommended:jQuery Video Tutorial

In many cases, based on certain conditions and after performing certain actions, we need to set the HTML button or input tag to Disable or remove it from the web page. If you are looking for a way to make any button unclickable i.e. disable the button using jquery then you are in the right place.

For example, when a click on a button calls the jquery ajax function until its response arrives, we need to disable the button (not clickable). It's a good practice to disable the button so that users don't press it again and again.

In this article it will be explained how to disable any button, whether it is Button tag, anchor tag or div, li element.

HTML tags: add button, div, and a tag

Here we add a button tag, a div tag, and an anchor tag. Once clicked, we want to make it unclickable (disabled).

DIV CLICK
  Anchor Tag Click me Jquery代码：禁用HTML元素（div,button,anchor标签） $("#btnButton").on('click', function () { // JQUERY $(this).attr("disabled", "disabled"); // JavaScript document.getElementById("btnButton").setAttribute("disabled", "disabled"); console.log("btn clicked"); }); $("#btnDiv").on('click', function () { $(this).off('click'); document.getElementById("btnDiv").setAttribute("disabled", "disabled"); console.log("Div clicked"); }); $("#btnAnchr").on('click', function (e) { $(this).attr("disabled", "disabled"); e.preventDefault(); });

Explanation of the above code: When the button or div is clicked, the label is immediately disabled (not clickable).

Full code:

   
  
 请用Chrome或Firefox浏览器访问该网页，按F12打开控制台(console)， 然后点击下面的div或按钮，看日志(log)变化。 

 
 DIV CLICK 

 

 Anchor Tag Click me

   

The above is the detailed content of How to achieve unclickable elements in jquery. For more information, please follow other related articles on the PHP Chinese website!