We help IT Professionals succeed at work.

Code is working but keep getting console error, should I ignore?

Aaron Roessler
on
My code is working but i get a console error: Should I ignore it?
Uncaught Error: Syntax error, unrecognized expression: #lips/

URL is https://allgood.flywheelsites.com/shop/#lips/

Here is my code: the trailing slash was breaking this code but i finally got it working.
var url = window.location.href.replace(/\/$/, '');
var lastPart = url.substr(url.lastIndexOf('/') + 1);
if (lastPart === "#lips") {
jQuery('input.jet-checkboxes-list__input').each(function(){
var catagory_value=jQuery(this).val();      
for (var i=0;i<catagory_value[0].length;i++) {
if (catagory_value == "129") {
jQuery(this).parent().addClass("lips");
jQuery(window).load(function() {
      jQuery('.lips .jet-checkboxes-list__input').trigger('click');
});
} } }); }
Comment
Watch Question

Bill PrewTest your restores, not your backups...
CERTIFIED EXPERT
Expert of the Year 2019
Top Expert 2016

Commented:
If you are going to an anchor on that page, which the URL syntax seems to indicate, then why do you have the trailing slash.  Typically that would be:

https://allgood.flywheelsites.com/shop/#lips

Which doesn't cause the error.


»bp
Aaron RoesslerWeb Developer

Author

Commented:
I am not using an anchor for anchor purposes, using it for my Jquery to check if url ends with "#lips or #deodorants or etc..".  Then click a certain checkbox.

I installed a Wordpress plugin called "Redirection" and am redirecting all Woocommerce product-category urls..
Here is a sample:
https://allgood.flywheelsites.com/product-category/lips  Redirects to  https://allgood.flywheelsites.com/shop/#lips

We use a general SHOP page that will Filter results using checkboxes. It seems wordpress keeps adding the ending slash which breaks my jquery code.

So I managed to get everything working without errors by changing my code that enqueues the script.

add_action('wp_enqueue_scripts', 'ag_enqueue_scripts');
function ag_enqueue_scripts() {
    wp_enqueue_script( 'ag_scripts', get_stylesheet_directory_uri() . '/js/ag_scripts.js');
}
CERTIFIED EXPERT

Commented:
have a look at this, it may help you make your code work better with or without the slashes

https://tommcfarlin.com/trailing-slash-in-wordpress/

https://developer.wordpress.org/reference/functions/untrailingslashit/
CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019
Commented:
I can't see where in your code you are using #lips/ - do you know where that error is originating from? The console is just pointing to the jQuery part. If I run the code as you have it, in the console it runs without error.
[Sidebar - please format your code snippets properly and include in CODE tags - makes answer the question much easier]
Example
var url = window.location.href.replace(/\/$/, '');
var lastPart = url.substr(url.lastIndexOf('/') + 1);
if (lastPart === "#lips") {
  jQuery('input.jet-checkboxes-list__input').each(function () {
    var catagory_value = jQuery(this).val();
    for (var i = 0; i < catagory_value[0].length; i++) {
      if (catagory_value == "129") {
        jQuery(this).parent().addClass("lips");
        jQuery(window).load(function () {
          jQuery('.lips .jet-checkboxes-list__input').trigger('click');
        });
      }
    }
  });
}

Open in new window


I would also change the way you are checking the url to

if (window.location.href.match(/\/#lips\/?$/)) {
// Check here
}

Open in new window

Aaron RoesslerWeb Developer

Author

Commented:
Here is my working script. I have 10 hash urls i need the code to check for so I duplicated this 10 times each with different #. here they are (lips, deodorants, gift-sets, kids, skin, all-good-goop, coconut-oils, herbal-freeze, lotions, sun )
	var url = window.location.href.replace(/\/$/, '');
	var lastPart = url.substr(url.lastIndexOf('/') + 1);
	if (lastPart === "#deodorants") {
jQuery('input.jet-checkboxes-list__input').each(function(){
var catagory_value=jQuery(this).val();	
for (var i=0;i<catagory_value[0].length;i++) {
if (catagory_value == "130") {
jQuery(this).parent().addClass("deodorants");
	jQuery(window).load(function() {
		jQuery('.deodorants .jet-checkboxes-list__input').trigger('click');	
	});
	
} } }); }

Open in new window

Explore More ContentExplore courses, solutions, and other research materials related to this topic.