Trying to escape a string to use as a jQuery selector - javascript

I have the following code, which I stole from another SO question,
$('#'+'^`test'.replace(/[!"#$%&'()*+,.\/:;<=>?#[\\\]^`{|}~]/g, "\\\\$&"))
which produces the following error.
Uncaught Error: Syntax error, unrecognized expression: #\\^\\`test(…)
I just have some IDs with crazy characters, like ^ and `, that I need jQuery to not choke on. I don't get why that error is happening, because if I manually add the slashes into the string like,
$('#'+'\\^\\`test')
then it works fine. What's wrong with the regex method?

I just have some IDs with crazy characters, like ^ and `, that I need jQuery to not choke on.
By far the simplest way to address that is with an attribute selector:
$('[id="' + theId + '"]').doSomething();
As long as theId doesn't contain backslashes or double quotes, no need for further escaping.

Another work around is to use the vanilla getElementById, which doesn't parse the selector. That way you still have the efficiency of selecting by id:
let res = $(document.getElementById('^`test'));

How about using this?
const $ID = function(selector){
return $('[id="' + selector.match(/#?(\S+)/)[1] + '"]')
}
Then you can use it just like jquery
$ID('#^`div')

You need 2 times the escape . Becouse first the replace/regex need the escape to write a escape. The next escape is need from jquery by $().
More clear syntax as the postet regex is:
"#^bla`".replace('^','\\\^').replace('`','\\\`');
will replace "#^bla`" to "#\\^bla\\`".
Uncaught Error: Syntax error, unrecognized expression: #\\^\\`test(…)
If you want to use your regex you must also escape [ ] with \[ and \].
"+".replace(/[!"#$%&'()*+,.'()*+,.\/:;<=>?#\[\\\]^`{|}~]/g, "yes")

Related

I got error : "missing) after argument list"

Got error:
missing ) after the argument list
$('.next-btn').append("<a class="actionsubmit" ng-click="onSubmit('hello.html')">Check</a>");
It looks like you need to escape special characters inside your append string,
$('.next-btn').append("<a class=\"actionsubmit\" ng-click=\"onSubmit('hello.html')\">Check</a>");
The error is generated by syntax issues.
Your Code:
$('.next-btn').append("<a class="actionsubmit" ng-click="onSubmit('hello.html')">Check</a>");
You cannot use " inside this string without escaping it. For example:
$('.next-btn').append("<a class=\"actionsubmit\" ng-click=\"onSubmit('hello.html')\">Check</a>");
Please read: https://www.w3schools.com/js/js_strings.asp
Because strings must be written within quotes, JavaScript will misunderstand this string:
var x = "We are the so-called "Vikings" from the north.";
The string will be chopped to "We are the so-called ". The solution to avoid this problem, is to use the backslash escape character. The backslash (\) escape character turns special characters into string characters.
Now you can also create the element in jQuery. Advised code:
var newA = $("<a>", {
class: "actionsubmit",
"ng-click": "onSubmit('hello.html')"
}).html("Check");
$('.next-btn').append(newA);
Hope that helps.

Javascript unrecognized expression

i have complex element attributes like
CS::#station1/cs1_station-0/be/PA300___(1)#22
I tried to remove all expressions with this regex
/[/\#\/\_\/\#\/\:\/\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g
but i get exceptions like:
Error: Syntax error, unrecognized expression: #OS::#station1\cs-0...
Has somebody a regex to escape all unrecognized js expressions?
/[/\#\/\_\/\#\/\:\/\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g
should probably be
/[-\/#_#:[\]{}()*+?.\\^$|]+/g
Perhaps a negated character class may be useful:
var s = 'CS::#station1/cs1_station-0/be/PA300___(1)#22';
console.log(s.replace(/[^a-z0-9]+/gi, ''));

Jquery Syntax error, unrecognized expression on id selector

Im using angular and jquery to scroll to an element base on his location hash string.
In my situation i need to include in the string the '?' char, but its seems like jquery has problem with this.
This is the link:
when Are Lottery Results Updated OnThe Site
This is the jquery code:
var elem = '#' + $location.hash();
console.log($(elem));
The error:
Error: Syntax error, unrecognized expression: #whenAreLotteryResultsUpdatedOnTheSite?
Any solution?
Yes, jQuery will refuse to select elements with special characters in CSS selector. You just need to escape them with \\:
var elem = $location.hash().replace(/\?/, '\\\\?');
This will properly escape ? character.
Also note that location.hash will already include leading # so you don't need to prepend one more.

jQuery: Uncaught Error: Syntax error, unrecognized expression

console.log($('"#'+d+'"'));
In my HTML, I have:
<div id="2013-10-23">
<h1>5</h1>
<p>eeeeeeeeeeee</p>
</div>
In the above code, I have one <div> with an id of 2013-10-23, and when getting that id it is throwing this syntax error:
Uncaught Error: Syntax error, unrecognized expression: "#2013-10-23"
try
console.log($("#"+d));
your solution is passing the double quotes as part of the string.
The "double quote" + 'single quote' combo is not needed
console.log( $('#'+d) ); // single quotes only
console.log( $("#"+d) ); // double quotes only
Your selector results like this, which is overkill with the quotes:
$('"#abc"') // -> it'll try to find <div id='"#abc"'>
// In css, this would be the equivalent:
"#abc"{ /* Wrong */ } // instead of:
#abc{ /* Right */ }
This can also happen in safari if you try a selector with a missing ], for example
$('select[name="something"')
but interestingly, this same jquery selector with a missing bracket will work in chrome.
Try using:
console.log($("#"+d));
This will remove the extra quotes you were using.
Try this (ES5)
console.log($("#" + d));
ES6
console.log($(`#${d}`));
I had to look a little more to solve my problem but what solved it was finding where the error was. Here It shows how to do that in Jquery's error dump.
In my case id was empty and $("#" + id);; produces the error.
It was where I wasn't looking so that helped pinpoint where it was so I could troubleshoot and fix it.
If you're using jQuery 2.1.4 or above, try this:
$("#" + this.d);
Or, you can define var before using it. It makes your code simpler.
var d = this.d
$("#" + d);
For some people coming here, you might have a special character in your id attribute, so jQuery can't read it correctly.
ID and NAME tokens must begin with a letter ([A-Za-z]) and may be
followed by any number of letters, digits ([0-9]), hyphens ("-"),
underscores ("_"), colons (":"), and periods (".").
Check this answer for more details:
What are valid values for the id attribute in HTML?
I had a selector with space ('#test .test').
Example of my error:
var href = "javascript:scrollto('"+key+"')";
For me this helped: encodeURIComponent(value)
var href = "javascript:scrollto('"+encodeURIComponent(key)+"')";

Jquery problems with some chars in strings

I'm having troubles with some string chars like 'c++', when trying manipulating that i receive an error: uncaught exception: Syntax error, unrecognized expression: +
Is there some way of declaring strings or somenthing more that can be usefull to this case?
In this case i pass var k = 'c++' to a function which prints that var in this way:
$('#wrapper').html('<span>'+k+'</span>');
Are you eval'ing the above code? As it stands what you have there works fine if it's just included in a page with var k = "c++".
If you are going to eval the string, then you should surround 'k' with quotes and also escape any quotes that might be in it.
That code looks fine. Runs with no problem here
That is not the line of code causing the error

Categories