- TLC Home Home
- Discussions Discussions
- Documentation Documentation
- Knowledge Base Knowledge Base
- Education Education
- Blog Blog
- Support Desk Support Desk
08-09-2017 04:29 PM
I've been using the following JQuery selector to target internal links in a JQuery onHandler extension (1.7 or higher) with success on sites that are running either version 1.10.2 or 1.11.0 of JQuery:
[href*="' + ut.domain + '"],a:not([href^="#"],[href^="http"],[href^="tel:"])
However, on another site that is running 1.12.4 I get an error:
Uncaught Error: Syntax error, unrecognized expression for that selector.
The issue definitely seems to be isolated to the first part of the selector: [href*="' + ut.domain + '"]
Has anyone else experienced issues with this newer version of JQuery and these type of selectors that compare against an object? Any advice on how to solve?
Solved! Go to Solution.
08-09-2017 05:57 PM
08-15-2017 01:30 PM
Hi @Terry_Howard. Let me see if I can find you some help. Sit tight.
08-15-2017 03:49 PM
hi @Terry_Howard, I'm not sure at all about how Tealium's onHandler extension handles the selectors. But since jQuery 2.2.0/1.12.0 jQuery does some extra checks for unquoted variables. Please refer to the following Jquery Migrate Issue:
https://github.com/jquery/jquery-migrate/issues/140
I know your selector uses quotes properly ( not sure if the jQuery handler on tealium does some parsing messing up things ).
Another thing I would try is using window.utag_data["ut.domain"] instead of just ut.domain, just to be sure data is passed propertly from the main variable.
08-15-2017 04:27 PM - edited 08-15-2017 04:56 PM
@Terry_Howard I'm been investigating how the extensions works.
This is selector you're using:
[href*="' + ut.domain + '"],a:not([href^="#"],[href^="http"],[href^="tel:"])
Which Tealium transforms to the following piece of code:
if (1) { if (typeof utag.runonce[37] == 'undefined') { utag.runonce[37] = 1; jQuery(document.body).on('click', '[href*="" + ut.domain + ""],a:not([href^="#"],[href^="http"],[href^="tel:"])', function(e) { utag.link({ "event_action": 'click link' }) }) }
As you can see single quotes are converted to double quotes, therefore you can't use variables within your selector. Where you running the same selector previously or using the ut.domain is a new addition?.
If you were previusly using single queotes it looks like something was updated on Tealium Side since the last time you used it in other places.
08-21-2017 01:37 PM - last edited on 08-21-2017 03:00 PM by kathleen_jo
Hi @thyngster. I think you are correct, it is the change in how quotes are being handled in the newer versions of JQuery. My solution was to create a version of my extension for each affected domain that has the domain literally in the selector instead of the variable. Not a particularly scaleable way forward, but it works. I think the Tealium system would have to be updated to recognize the usage of a variable in a selector and appropriately handle the quotes all the way through to the page.
08-21-2017 03:03 PM
@Terry_Howard wrote:
Hi @thyngster. I think you are correct, it is the change in how quotes are being handled in the newer versions of JQuery. My solution was to create a version of my extension for each affected domain that has the domain literally in the selector instead of the variable. Not a particularly scaleable way forward, but it works. I think the Tealium system would have to be updated to recognize the usage of a variable in a selector and appropriately handle the quotes all the way through to the page.
Hi @Terry_Howard. Great point about the scalability. Let me check and see if we already have something in for variable in a selector usage. Hold on.
Copyright All Rights Reserved © 2008-2023