Escaping characters to get a valid jQuery id
jQuery is a very powerful javascript library that I use all the time. For the most part, I find that it's simple to use, yet easy enough to do very advanced things. Anyone who has used jQuery knows that you can do quite a lot with selectors. One of the caveats that I run into often is using a selector for a DOM element that contains special characters. jQuery requires many characters to be escaped in the selector in order to function properly. The problem here is that jQuery doesn't offer a function that will escape your selector value for you. I've created such a function here:
// Escapes special characters and returns a valid jQuery selectorfunction jqSelector(str)
{return str.replace(/([;&,\.\+\*\~':"\!\^#$%@\[\]\(\)=>\|])/g, '\\$1');
}
If you want to use the jqSelector() function, you can do so like this:
The HTML
<div id="id.with,special#characters" class="testElem[1]"></div>
The javascript
// ID selector$('#'+jqSelector('id.with,special#characters')).text('My Selected Element');
// Class selector$('.'+jqSelector('testElem[1]')).text('My Selected Element');
This simple function will do the work of escaping all the characters you need to form a proper jQuery selector. Enjoy!
