We Keep Coding

jquery unrecognized expression div

I have a Syntax error, unrecognized expression. I use a set of links to change to a div on the same page and sent a variable with it.
Voorpagina
Updates
Over mij
$taal is the language the user choose, like NL, EN…
After the user clicks, get this in action:
$('a').click(function (e) {
$('html, body').animate({
scrollTop: $($(this).attr('href')).offset().top}, 500);
});
Everything works but I get the next error in my console:
Uncaught Error: Syntax error, unrecognized expression: ?taal=nl#Updates
at Sizzle.error (jquery-3.6.0.js:1681:8)
at Sizzle.tokenize (jquery-3.6.0.js:2381:11)
at Sizzle.select (jquery-3.6.0.js:2842:20)
at Function.Sizzle [as find] (jquery-3.6.0.js:898:9)
at jQuery.fn.init.find (jquery-3.6.0.js:3099:11)
at new jQuery.fn.init (jquery-3.6.0.js:3209:32)
at jQuery (jquery-3.6.0.js:161:10)
at HTMLAnchorElement.<anonymous> (?taal=nl:175:24)
at HTMLAnchorElement.dispatch (jquery-3.6.0.js:5430:27)
at elemData.handle (jquery-3.6.0.js:5234:28)
How can I resolve this error? By the way, if I remove the <?PHP echo $taal; ?> variable in the links above (first code), the error is gone but I need that variable for further navigation.
I’ve tried to rebuild the code, removed $taal and the error was gone but I need that variable.
Thanks in advance.

You are using the whole url, you want to just use the hash portion.
$('a').on('click',function (e) {
e.preventDefault();
console.log(e.target.hash);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
A
B
C

You need a selector as the argument to $(). The selector is after the # in the href, e.g. #Home or #Updates. You need to extract that from the href attribute.
$('a').click(function (e) {
let href = $(this).attr('href');
let target = href.split('#')[1];
$('html, body').animate({
scrollTop: $(`#${target}`).offset().top}, 500);
});
});

I've fixed the issue. In the code do I check now if $taal exists or not. If not, then I use my old jQuery link code, the code on the top of this page. If $taal does exist, then I split the URL variables and do I use Barmar's code. Thanks for all your help.

Get img from url in jQuery [duplicate]

$(document).ready(function(){
var page = window.location.hash;
if(page != ""){
$('a[href='+ page +']').addclass('selected');
pageload(page.replace('#/page/', 'pages/?load='));
}
$('#top a').click(function(event){
$('#top a').removeClass('selected');
$(this).addClass('selected');
pageload($(this).attr('href').replace('#/page/', 'pages/?load='));
event.preventDefault;
});
});
<div id="top">
Link
Link
Link
Link
Link
</div>
So when i'm trying to do this, and load up a page using the window.location.hash, i get an error in the console saying:
Uncaught Error: Syntax error, unrecognized expression:
[href=#/page/link]
How can i make this work?

Try this instead:
$('a[href="'+ page +'"]').addClass('selected');
(You need to escape the value of the href – with this, you get a[href="#/page/link"].)

Your regular expression doesn't need the speech marks:
replace(#/page/, ...

"TypeError: $(...) is null" What's Going On?

Firebug is giving the error:
TypeError: $(...) is null
$('#menu img').hover(
I have no idea why. The seemingly problematic script is this which replaces an image when the cursor hovers over an image:
$(document).ready(function()
{
var storeNormalPath;
$('#menu img').hover(
function()
{
storeNormalPath = $(this).attr('src');
var imgArray = $(this).attr('src').split('.jpg');
$(this).attr('src', imgArray[0]+'Hover.jpg');
},
function()
{
$(this).attr('src', storeNormalPath);
}
).click (function()
{
//empty now
});
});

After some looking over your page using chrome's console, it looks that even $(document) is returning null.
jQuery(document) however, works, which suggests there is something in conflict with jQuery's $ operator.
(Source: I would direct you to this question: $.document is null)
Seeing that you have both jquery-1.5.1.min.js AND jquery.1.4.2.js referenced in your page header, perhaps that could be the reason of the conflict? Have you tried loading only one of them?
Let us know if that helps, sorry I couldn't be more help.
Good luck!

Making hash crawlable with #! and surviving the change

I'm trying to make my site crawlable by changing the # to #!. The page works OK when clicking on the link, but I cannot manage to fix the script for calling the hash directly from the URL.
This is what I have
HEAD
$(function() {
$("#tabs a").click(function() {
var page = this.hash.substr(2);
$.get(page+".php", function(gotHtml) {
$("#content").html(gotHtml)
});
});
(location.hash) ? $("a[href="+location.hash+"]").click() : $("#tabs a:first").click()
});
BODY
< ul id="tabs">
< li>< a href="#!foo" >foo</a>< /li>
< li>< a href="#!foo2" >foo2</a>< /li>
< li>< a href="#!foo3" >foo3</a>< /li>
< /ul>
When I click on foo, content loads ok, but if I call my site with www.foo.com/#!foo, it doesn't load the content.
Can anyone guide me?

If you look in your error console you'll see that it's throwing the following exception:
Uncaught Error: Syntax error, unrecognized expression: [href=#!foo2]
In order to fix this, you can change your JavaScript ever so slightly.
$(function() {
$("#tabs a").click(function() {
var page = this.hash.substr(2);
$.get(page+".php", function(gotHtml) {
$("#content").html(gotHtml)
});
});
(location.hash) ? $("a[href='"+location.hash+"']").click() : $("#tabs a:first").click()
});
Notice I just stuck single quotes around your href portion of your selector.
On a related note, I would recommend that if you're going to do hash-bangs (they are a headache) that you make the href attribute the actual URL value that you're going to. In the JavaScript do the switch over to a hash-bang. The reason for this is that users with JavaScript disabled will not be able to use your site. Your click function will change ever so slightly to set the hash, load the page, and disable the default click behavior.
Update for question: On the related note, I meant if the href="#!foo" change that href to actually be href="foo.php". If a user does not have JavaScript enabled they can go to foo.php and see the page. If the user does have JavaScript place the hashbang in the URL and do what you did previously. You can do this manually; however, libraries like jQuery BBQ can really make this trivial.

Simple jQuery - Appending to body causes following code to not work

I am trying to do two things:
Append a div to the body
Make all clicks to links class editlink make a popup and not go to their href
Doing just #2 is fine:
$(document).ready(function(){
// $(body).append("<div>Hello world</div>");
$("a.editlink").click(function(event){
alert("Javascript-endabled users should see this");
event.preventDefault();
});
});
But if I uncomment the code for #1 like below,
$(document).ready(function(){
$(body).append("<div>Hello world</div>");
$("a.editlink").click(function(event){
alert("Javascript-endabled users should see this");
event.preventDefault();
});
});
the div appears as expected, but clicking editlink links no longer gives me a popup and navigates to the link's href.
What's going on?

Did you mean:
$("body")
rather than:
$(body)
?
Can I recommend that you use Firebug to get decent error reporting? You'd have found this very quickly with Firebug.

You are missing the quotes for your body tag selector:
$('body').append("<div>Hello world</div>");