FAQ Database Discussion Community


Assigning onclick via jQuery selector

javascript,jquery,jquery-selectors
I am trying to assign an anchor's onclick via javascript - see jsfiddle below: <a id="link_a" class="linka" href="http://www.google.com">link 1</a> var lnkA=$('.linka'); lnkA.onclick=function(){alert(this.innerHTML);}; fiddle: https://jsfiddle.net/andrewtr/tkfvyr7o/ Code: However, it doesn't seem to work. What am I doing wrong? Thanks!...

JQuery .find() failing on an .ajax() result

jquery,html,ajax,google-chrome-extension,jquery-selectors
I'm working on a Chrome extension which, under certain conditions, performs a $.ajax() request and then uses information of specific elements in the returned HTML. For now, I'm simply trying to have it access the specific element and log it to the console to ensure it works correctly. To start,...

Not able to access click event with jQuery selector

javascript,jquery,html,jquery-selectors
I am having a hard time accessing a click even with my jQuery selector. Here is my HTML: <li class="handle-bars"> <span class="fa fa-bars pull-right text-primary m-t-10"></span> <span class="fa fa-cogs pull-right text-primary m-t-10" id="trigger-modal-editor" style="cursor:pointer" data-target="#modalSlideLeft" data-toggle="modal"> </span> </li> Here is my jQuery selector: <script> $(document).ready(function() { $('#trigger-modal-editor').click(function() { alert('Hello'); });...

Jquery: How to select a specific previous id dynamically?

jquery,jquery-selectors
I'm trying to add a comment box like you could open in Facebook when you click on "comment". So I want to select the most previous id containing "users_log_id" of the current "comment" link I'm clicking on. Note: After "users_log_id" is always the id of the current id like this:...

change color when a country selected

javascript,jquery,css,jquery-selectors
I am trying to change color of a telephone field when a country is selected on the <select> options. For example if someone selects UK the color must change to Red. But I'm not sure what I'm doing wrong. This doesn't change at the moment. jQuery('select[name="address[_item1][country_id]"]').change(function() { if (jQuery(this).val() ==...

Force angular.element .on 'change' to call specified function on the same file

angularjs,events,jquery-selectors,document
When I select say hello.png the first time, it loads it and calls handleFileSelect() function. However, if I pick the same file again, the function won't get called until I pick another filename. How can I force it to call the function? I was thinking that the modification would be...

jQuery with the plus sign

javascript,jquery,html,jquery-selectors
I wonder why jQuery doesn't allow "+" sign. Here is an example of how it works with "1" and "3" but not with "2+". Just mouse-over the text above every div. <div id="div-2+"></div> JSFiddle $('a.hover').mouseover(function() { dataI = $(this).data('i'); $('div#div-' + dataI).addClass('h'); }); $('a.hover').mouseout(function() { dataI = $(this).data('i'); $('div#div-' +...

action on parent's sibling in jQuery

javascript,jquery,jquery-selectors
Here's my html code: <div class="btn-group js_publish_management> <button class="btn btn-danger js_publish_btn">Not Published</button> <button class="btn btn-success js_publish_btn">Published</button> <button type="button" t-attf-class="btn btn-default dropdown-toggle" data-toggle="dropdown"> <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu"> <li> <a href="#" class="js_publish_btn"> <span...

how do I set .css backgroud url of a select box in jquery?

jquery,jquery-selectors
I have a select box and I would like to set its background url in jquery jQuery(document).ready(function($){ $('select').css({ ("background", "url("+site_url+"/img/select-arrow.png)") }); }); This code doesn't work...

jQuery :empty not working with input

javascript,jquery,jquery-selectors
I am having a problem in using jQuery's :empty pseudo selector. Basically, it isn't working on inputs the way I think it should. Given this html, I'm trying to get a count of all the inputs which don't have values without a loop. <div id="sampleDiv"> <label>My first Input:</label> <input name="test"...

Syntax error with jquery selecting table row with a specific attribute

javascript,jquery,jquery-selectors
I am trying to pull the data out from a table row so that it can be updated, but I am really confused as to why it is not happening. Below is a snippet of generated HTML. The record ID is held in the first data element as the value...

Jquery Change CSS of variable div

jquery,jquery-selectors
I have a table with a bunch of td with the classes markTD and they each have a different integer for the attribute value. I would like to click the button called mark and change the color of just 1 of the td. $('#mark').click(function(){ var h2 = parseInt($('#h2').attr('value'), 10); //h2...

Union between two jquery selectors

jquery,jquery-selectors,selector
This is my case: var elems = form.find(':input'); var clEditors = form.find('.cleditor').parent(); elems.css('border', '2px'); clEditors.css('border', '2px'); Is there anyway I could prevent the duplication and do something like this: var elems = form.find(':input').union(form.find('.cleditor').parent()); elems.css('border', '2px'); I tried using a multi selector with the :parent selector and it didn't work: var...

How to extend a jQuery selector that is stored in a variable?

jquery,performance,jquery-selectors
I have a jQuery selector stored in a variable, like so: var myVariable = $( ".js-selector" ); I'm wondering if and how I can use this variable to select children of this element, instead of writing: $( ".js-selector .some-child" ); How do I do this? I'm also wondering if I...

Embedding a function inside .delay() doesn't work porperly

jquery,html,html5,css3,jquery-selectors
So I have HTML with a table and each column has button which should fade out that table and then fade in another DIV which contains info regarding about that specific column I clicked on. so the Jquery looks like this: $(document).ready(function(){ $('#motoBttn').bind('click', function(){ $('#ServicesContent').fadeOut(); $('#infoSlector').fadeIn(); $('#motoDescContent').fadeIn(); $('#goBackDiv').fadeIn() ; })...

Jquery onchange event not triggering

javascript,jquery,html,struts2,jquery-selectors
I am stuck in a situation where I have a Struts2 form with a select tag which when changed should trigger an event and I can't figure out why the onchange function is not triggering but the peculiar thing is that the onchange trigger event works in an other example....

How is this selector working?

javascript,jquery,jquery-selectors
In the HTML I have the following element: HTML <input id="userNameTxt" type="text" class="input" value='ABC> And i am selecting it like this in jQuery: APP.js $(userNameTxt).val() What is this selector selecting? (Like when I use $('.something') -> it's selecting the Class of the element or $('#something') it's selecting the ID.) It...

How to trigger neighbour element to “this” object in jquery

jquery,html,css,jquery-selectors
I have 1 button - <a> link and list - ul. I need to show/hide list when I click on button. Here is the code: <div class="wide-tile" id="tile-1"> <div class="size-set"> <a href="#" class="toggle-btn"> > </a> <ul class="size-list"> <li>1x1</li> <li>1x2</li> <li>2x1</li> <li>2x2</li> </ul> </div> <a href="details.html" class="wide-tile-link"> <span class="title">About us</span> </a>...

Why jquery nth child give inconsistent result when apply to ul and li

jquery,jquery-selectors
I have a container with a group of uls, of each have 4 lis. I created the first ul then copy the rest by Javascript. When I call to find nth-child of all uls, eg $("ul:nth-child(1)"), it return nothing, the first ul item appear with $("ul:nth-child(2)") (n is starting from...

Is there any way to get the closest parent which have a specific class

jquery,jquery-selectors
In my application I have to get to the closest parents of the input/textarea which has the class of ('form-group'). I use the following code: $("#contactus").validate({ highlight: function (element, errorClass) { $(element).parent('.form-group').addClass('error-sign-up'); } }); For the cases of element which is input the code is fine (the direct parents of...

Is it okay to store the result of a JQuery selector in a variable?

javascript,jquery,jquery-selectors
Developers I know tend to call the same JQuery selectors over and over instead of storing the result in a variable. They are consistent with this approach. For example, they do this: var propName = $(this).attr('data-inv-name'); var propValue = $(this).attr('data-inv-value'); Instead of this: var current = $(this); var propName =...

How do I get the value in this neighboring element?

jquery,jquery-selectors
I'm having trouble with the jQuery part: HTML <div> xxxxxxxxx <div> <ul> <li><button class="addnum">xxxx</button></li> </ul> </div> </div> <div class="num"> 12345 </div> Script $(".addnum").click(function() { var pur = $(this).siblings(".num").clone(); }); I'm trying to clone the value inside ".num", which is 12345. How should I select it? *edit: sorry, I didn't mention...

Using the this keyword with jQuery selectors

jquery,jquery-selectors,this
Can someone please help me with the syntax of using the jQuery this keyword? Here is my code that works: var obj = jQuery.parseJSON(data); $('.example_infobox1').addClass(obj.gridlayout); $('.example_infobox1 .info-box').addClass(obj.boxcolor); $('.example_infobox1 .info-box-icon').addClass(obj.iconcolor); $('.example_infobox1 i').addClass(obj.icon); $('.example_infobox1 .info-box-text').html(obj.text); $('.example_infobox1 .info-box-number').html(obj.number); Here is the code that I am working on: var obj = jQuery.parseJSON(data);...

How to select a single cloned element?

jquery,jquery-selectors,clone
I am dynamically adding a div to my webpage when ever I click a button. I am doing this by cloning an original div and appending the clone. I have the above figured out. However, within the cloned div there is a text input. I want to make sure the...

JQuery: Select all ids ending with specific name and change its siblings input button

javascript,jquery,jquery-selectors
I'm trying to indicate that a text can't be sent just yet, showing a grey input submit button with the class btn-primary. Instead btn-default is a coloured input button. However there are many textareas on one single site as my JQuery code should be used for both posting a new...

jQuery append using nth-child instead of first

jquery,jquery-selectors
I'm editing a script that was originally like $('.navigation-area:first').append('<li>New Item</li>'); However the application has since changed and this item needs to be appended to the second .navigation-area. I've tried: $('.navigation-area:nth-child(1)').append('<li>New Item</li>'); but that didnt work. Are there any other suggestions to how to do this? I would've assumed the above...

Is there any meaning to 'first' pseudoclass?

jquery,jquery-selectors
I found this code: $("#some_list li a:first").click(); And I can't find any source about 'first' pseudoclass. Have anyone seen something like that ? Does it mean that first element on list is clicked ?...

Concatenate CSS selectors

jquery,css,jquery-selectors,css-selectors
Is there a smarter way where I can use $self instead of using foo in $('.foo.bar')... ? It feels like the extra foo is redundent. I don't want to look through some selector I already found. $('.foo').on('click', function () { $self = $(this); $('.foo.bar').removeClass('bar'); // Works but feels wrong. //$self('bar').removeClass('bar');...

Find all input with specific keyword [duplicate]

jquery,jquery-selectors
This question already has an answer here: jQuery selector for a checkbox that contains certain text in its name attribute 3 answers I'd like to find all the inputs that have at the end of their names the keyword [0]. I guess I have to use the following method:...

AddClass in jQuery on runttime and select the new class

jquery,class,jquery-selectors,onclick,addclass
I'd like to add a class to a div tag in runtime (after clicking the tag) and select the div tag by the new class name afterwards. Here is my code: HTML <div class="black" id="" style=""> black </div> CSS .black{ color:black; } .green{ color:green; } jQuery should remove class "black"...

How to find an element by data attribute with find() function?

javascript,jquery,jquery-selectors
I add a data attribute to an element via jquery data() function. I want to use find() function to get the element. But obviously, it does not work. What I want to do is caching the element's parent element and do a lot of things. Like this: var $parent =...

what is differences between $('element , #id') and $('element', '#id') in jquery

jquery,jquery-selectors
I know $('element, #id') selects all elements & #id. But what does do $('element', '#id') !? I only know they aren't similar. So what's difference?

Get First Span of a
using the data-id

javascript,jquery,html,jquery-selectors,jquery-ui-draggable
I want to get the first span element of a div. This is how i get the div DOM element. helper: function(event,ui){ var dataId = $(this).data('id'); console.log($('[data-id="' + dataId + '"')); } NOTE Im using Draggable plugign from jquery-ui The console.log prints correct the div element, but now i want...

Strange behaviour with jQuery pseudo selector :visible

javascript,jquery,jquery-selectors
I have a query that looked like this: $("div.modal:visible select#DTE_Field_calculator\\.type") which would attempt, in theory, to find that <select> tag inside of the currently visible div.modal element. Unfortunately, it would return nothing at all, despite the DOM looking exactly as you would expect (<div class="modal">...<select id="DTE_Field_calculator.type">...) If I removed the...

jQuery selector