simple way rather than to call a function repeatedly in javascript - javascript

I have a function and some input element(s) will use that for a purpose.
i tried to make an array of them and pass to that function, but failed.
$("#txtFirst").change(function(){validateForm($(this));});
$("#txtLast").change(function(){validateForm($(this));});
$("#txtNick").change(function(){validateForm($(this));});
how to make it more simple, rather than use same format repeatedly?

You can target multiple elements in one selector :
$("#txtFirst, #txtLast, #txtNick").change(function(){validateForm($(this));});

Try this:
$("#txtFirst, #txtLast, #txtNick").change(function(){validateForm($(this));});

Related

Is there a way to bind and call at the same time?

Say I have code like this:
var boundFilter = this.filterCouriers.bind(this);
boundFilter();
Is there a way to call that in one line?
(Basically I am wondering if there is a way to call the bound method without having to store it in a variable.)
Just use call
this.filterCouriers.call(this);
The call() method calls a function with a given this value and arguments provided individually. MDN - call
bind returns a function, so you can call it immediatelly:
this.filterCouriers.bind(this)();
this.filterCouriers.bind(this)();
This should do the trick. If not try this:
(this.filterCouriers.bind(this))();

Make get() returning a jQuery object

Is there a way to have get() returning a jQuery object instead of "just" the DOM element?
Example:
$("div").get(0) returns [<div></div>] instad of <div></div>.
I'd like to prevent overwrapping like $($("div).get(0)) because the query will get a little bit longer than the example and I fear the readability gets lost. I'd rather not use variables to save unnecessary DOM elements in the RAM, either.
Use eq() to return the jquery object instead of get()
$("div").eq(0)
Given a jQuery object that represents a set of DOM elements, the .eq()
method constructs a new jQuery object from one element within that
set. The supplied index identifies the position of this element in the
set, jQuery doc
You would use eq:
$("div").eq(0)
Use eq() instead , which will return jQuery object
$("div").eq(0)
Also try this also:
$('div:first')

how to apply jquery hover for multiple elements

I have a jquery object being passed to my function. In the function I get to one of the sibling. Now how do I apply the .hover to both the objects in one call.
Thanks
Not sure I know exactly what you want to achieve, but something like this?
myObject.siblings('selector').andSelf().addClass('hover');
The selector depends on how you want to find your sibling. You may want to use something like next('selector') or prev('selector'), rather than siblings().
Update
If the second object is not something that can be chained off of the first object, by a simple selector (which you should be able to do if it's a sibling), there's a more general solution.
var jq1 = $('any set of elements');
var jq2 = $('any other set of elements');
var all = jq1.add(jq2);
This way, regardless of how you find jq1 or jq2, they'll be combined into the variable all. From here you can do
all.addClass('hover');
or
all.click();
Working example

jQuery Multiple ID selectors

Here's a snippet of the start of my code:
var myUpload = $("#upload_link").upload({bla bla bla
Basically what I'm trying to do is make the same call with a few different ID's...
I would have assumed this would work but it doesn't:
var myUpload = $("#upload_link,#upload_link2,#upload_link3").upload({
Any ideas?
Try this:
$("#upload_link,#upload_link2,#upload_link3").each(function(){
$(this).upload({
//whateveryouwant
});
});
If you give each of these instances a class you can use
$('.yourClass').upload()
You can use multiple id's the way you wrote:
$('#upload_link, #upload_link2, #upload_link3')
However, that doesn't mean that those ids exist within the DOM when you've executed your code. It also doesn't mean that upload is a legitimate function. It also doesn't mean that upload has been built in a way that allows for multiple elements in a selection.
upload is a custom jQuery plugin, so you'll have to show what's going on with upload for us to be able to help you.
Make sure upload plugin implements this.each in it so that it will execute the logic for all the matching elements. It should ideally work
$("#upload_link,#upload_link2,#upload_link3").upload(function(){ });
If all your elements starting with upload_ in its id have the same purpose or syntax you could try and use the following:
$("*[id^='upload_']").each(function() {
$(this).upload()
});
This way you don't have to specify every single element in the selector.
it should. Typically that's how you do multiple selectors. Otherwise it may not like you trying to assign the return values of three uploads to the same var.
I would suggest using .each or maybe push the returns to an array rather than assigning them to that value.
That should work, you may need a space after the commas.
Also, the function you call afterwards must support an array of objects, and not just a singleton object.

giving different data() based on the element in one call

I'm trying to do something like this:
$('a').data('goto', this.href)
I realize I can do this in an each() call but is there a way to do this in one shot?
each is the most succinct way to do this. Unlike some functions (such as attr), data doesn't support the "pass a function and have it called for every element" convention.
Why do you need a duplicate of the href, though?
.data() doesn't have a callback method like .attr() for instance, so probably not. Using the .each() is probably the quickest way.

Categories