Search code examples
ace-editor

How to enable or disable highlight matching tag


In the editor the matching opening or closing tag is being selected. Looking through the documentation I've found the method jumpToMatching(Object select) but I don't see a method to disable or enable this feature.

enter image description here


Solution

  • I would suggest hiding it with CSS. The only drawback is that this will globally disable all bracket highlighting, not just for HTML tags.

    .ace_editor .ace_marker-layer .ace_bracket { display: none }
    

    See a working demo below:

    var editor = ace.edit("editor");
    editor.setTheme("ace/theme/dreamweaver");
    editor.getSession().setMode("ace/mode/html");
    #editor {
      position: absolute !important;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
    }
    #editor .ace_marker-layer .ace_bracket { display: none }
    <script src="https://cdn.jsdelivr.net/g/[email protected](min/ace.js+min/mode-html.js+min/theme-dreamweaver.js)" type="text/javascript"></script>
    <div id="editor">&lt;html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    	&lt;head>
    		&lt;style type="text/css" media="screen">
    			html, body {
    				height: 100%;
    			}
    		&lt;/style>
    	&lt;/head>
    &lt;/html></div>