jQuery Syntax Error in on click function - javascript

I am having trouble with my code. Specifically it is my jQuery click function. This may seem trivial, but I could not get it to respond whenever I tried to click a link. I tried to debug it, I updated to the latest jQuery. Then I put it into a Jsfiddle bin with the latest jQuery .... no dice. I honestly don't have a clue what I did wrong. I get a highlighted error on my ("nav a") jQuery selector but I have double checked with the internet and that is the proper syntax and it still won't run.
Below is my code. I cannot paste full HTML in here as it would become links as well.
$(document.ready(function(){
$("nav a").on("click",function(){
alert("What's WRONGG!");
});
});
I am using jQuery 2.1.4 on local and 2.1.3 on jsfiddle if that makes a difference. Here is the fiddle.

I believe you are missing a parenthesis on your $(document)
$(document).ready(function(){
$("nav a").on("click",function(){
alert("What's WRONGG!");
});
});

You have missed ) bracket near $(document
$(document).ready(function(){
$("nav a").on("click",function(){
alert("What's WRONGG!");
});
});

Related

Android Browser .click() not working javascript

I'm trying to click a button programmatically with javascript. Using the following code works fine:
var pbutton= document.getElementById('psubmit');
pbutton.click();
but when I try it on my mobile browser it wont fire the click event. Is their another way to do this for Mobile Browsers?
You will need to implement jquery for this or use a simple javascript.
You can add following code to implement through pure javascript
document.getElementById('psubmit').click();
You can check jsfiddle here
or for jquery you can implement by
$(document).ready(function(){
$('#btn').click(function(){ alert("JQuery Running!");});
$( "#btn" ).trigger( "click" );
});
You can check jsfiddle here
For both this to work you need to have id property defined. And to implement jquery you will need to add jquery file in you code. Hope this helps. Cheers :)
You could use jQuery
$(function(){
$('#psubmit').click()
});
Try using jquery:
$('psubmit').live("click",function(){
//Function code here
});

JQuery How to get selector with x2 .next() function

This situation have been post a lot in there but I didn't find the best way to solve my problem. Please help me this.
enter code here
Link
I want to make the button to open/hide the table content. I used slideToggle() in JQuery and next() to cacth the table content.In jsfiddle you can see. My code is worked.
But it just on the Click to SHOW/HIDE (worked) the Click to SHOW/HIDE (not work) is the MAIN button which I want to make (BECAUSE THE DESIGN). But when I put the button in there, it didn't work anymore. How can I solve this. Please help !
check this demo, if you are expecting the same thing
DEMO
$( "#clickme" ).click(function() {
$( "#toggleMe" ).toggle( "slow", function() {
// Animation complete.
});
});

How to invoke a 'click' when user clicks on href

I'm trying to fire an alert when a user clicks on an anchor tag, but the alert is not being fired. The code I am trying is below.
http://jsfiddle.net/NLdTJ/
<a id="collapse"> Collapse</a>
$(function(){
$('#collapse').click(function(){
alert('here');
});
});
Your code is ok, but you weren't loading jQuery in your fiddle.
http://jsfiddle.net/NLdTJ/3/
$(function(){
$('#collapse').click(function(){
alert('here');
});
});
P.S.:
I've attached your code again because SO didn't let me post the answer with just a link to jsfiddle and no code :)
You need to have a href before a tags become hyperlinks. Otherwise they are just anchors. TO fix it you should do the following:
<a id="collapse" href="#"> Collapse</a>
$(function(){
$('#collapse').click(function(){
alert('here');
});
});
Hope that helps.
(I also assumed jQuery, but your fiddle was set up with mooTools, not sure if it was on purpose. Here is my fix: http://jsfiddle.net/NLdTJ/13/)
Make sure you prevent the default click behaviour of a link.
$(function(){
$('#collapse').click(function(e){
e.preventDefault();
alert('here');
});
});
Working sample : http://jsfiddle.net/NLdTJ/15/
<a id="collapse" href="#" onclick="alert('here');"> Collapse</a>
It should work fine, just change the framework on JSFiddle to include JQuery and run on DOMReady
There's absolutely nothing wrong with your code. It will work when you pick a jQuery library from the Framework options on the left side of jsFiddle.
Updated fiddle to include framework.

jQuery preventDefault function not working on jsfiddle

I cannot get the following simple jQuery to work. I know I am overlooking something, so please help me out. Here is the code at http://jsfiddle.net/Z5waA/. It's a simple click the button, then alert with jQuery.
preventDefault(e); should be e.preventDefault();
code should be like this,
$('#submitResetPass').bind('click', function(e) {
e.preventDefault();
alert("hello");
});
and you need to add jQuery reference.
You had a couple issues. First, the jsFiddle wasn't set for jQuery. Then, your call to preventDefault wasn't correct. It works here: http://jsfiddle.net/jfriend00/v9aVb/.
$('#submitResetPass').bind('click', function(e) {
e.preventDefault();
alert("hello");
});
Use e.preventDefault() instead of preventDefault(e).

jQuery Class selector not working

I'm struggling to make an alert come up when an anchor tag with a specific class is clicked inside of a div.
My html section in question looks like this...
<div id="foo">
<a class='bar' href='#'>Next</a>
</div>
The jQuery section is as follows..
$('.bar').click(function()
{
alert("CLICKED");
});
My problem is that I cannot get this alert to come up, I think that I'm properly selecting the class "next", but it won't pick it up for some reason. I've also tried almost everything on this page but nothing is working. If I don't try to specify the anchor tag i.e. $('#foo').click(function()... then it works, but there will be multiple anchor tags within this div, so simply having the alert executed when the div is clicked won't work for what I need. The website this is on is a search engine using ajax to send information to do_search.php. Within the do_search.php I make pagination decisions based on how many results are found, and if applicable, a next, previous, last, and first link may be made and echoed.
EDIT: I just figured it out, it was my placement of the .next function, since it wasn't created on the initial document load but instead after a result had been returned, I moved the .next function to the success part of the ajax function since that is where the buttons will be created if they need to be, now it works.
Try using the live() command:
$(".bar").live("click", function(){ alert(); });
Because you load your button via AJAX, the click event isn't binded to it. If you use the live() command, it will automatically bind events to all elements created after the page has loaded.
More details, here
.live is now deprecated and is the selected answer for this. The answer is in the comments in the selected answer above. Here is the solution that resolved it for me:
$(document).on('click','.bar', function() { alert(); });
Thanks to #Blazemonger for the fix.
You surely missed $(document).ready(). Your code should be:
$(document).ready(function(){
$('.bar').click(function()
{
alert("CLICKED");
});
});
Hope this helps. Cheers
Make sure you have included JQuery Library properly.
Make sure your script has written between $(document).ready() in short $(function(){ });
Demo : http://jsfiddle.net/W9PXG/1/
<div id="foo">
<a class='bar' href='#'>Next</a>
</div>
$(function(){
$('a.bar').click(function()
{
alert("CLICKED");
});
});

Categories

Resources