JQuery Search for part of span class name - javascript

If I have a span class called "peanutty", and "peanuts", can I do a search for "peanut*"?

You can try:
$('span[class^="peanut"]')
jsFiddle example
See jQuery's attribute starts with selector.

You should take a look at this http://www.w3schools.com/jquery/jquery_ref_selectors.asp but what you are asking for is something like this $("[class~='hello']") which would be a contains selector meaning it would select any class containing the word "hello", while $("[class^='hello']") would select any class beginning with the word "hello".

Related

In JQuery how can I select all buttons which id start with "aaa" that have a class "class_name"?

How can I select all buttons which id starts with "aaa" that have a class which name is class_name1?
Summary:
select all element which id start with "aaa"
inside this group select all button which have a class called class_name1
remove this class and add a new class class_name2.
The last step should be:
$('#id').removeClass("class_name1").addClass("class_name2");
See jQuery ID starts with
$('button[id^="aaa"].class_name1').removeClass("class_name1").addClass("class_name2");
button[id^="aaa"] looks for buttons with ids starting with 'aaa'. .class_name1 limits those to elements with the class class_name1.
In JQuery, there is a class selector. For example, if you wanted all elements with class = class1, you would use $('.class1').each(function(){...});
Within this each() function, you could use the JQuery wildcard selector to get all elements with an id starting with 'aaa':
if($('[id^=aaa]')){
$('.class1').addClass('class2');
$('.class1').removeClass('class1');
}
});
I believe you will need to take care of those add and remove methods on separate lines in order for this to work.
Hope this helps.

different result with jquery and javascript

I have a select with id: param0.typeParameter.
I try to get it with jquery with:
$('#param0.typeParameter');
i get nothing but if it use this
document.getElementById('param0.typeParameter');
that work
To make jQuery select element with ID param0.typeParameter instead of element with ID param0 and class name typeParameter you should use the following:
$('#param0\\.typeParameter');
Official Proof
To use any of the meta-characters ( such as
!"#$%&'()*+,./:;<=>?#[\]^``{|}~ ) as a literal part of a name, it must
be escaped with with two backslashes: \\. For example, an element with
id="foo.bar", can use the selector $("#foo\\.bar").
SOURCE: http://api.jquery.com/category/selectors/
DEMO: http://jsfiddle.net/LtRxg/
You can try this instead:
$('[id="param0.typeParameter"]');
Or else the code assumes you want to select an element with id param0 and class typeParameter
jQuery uses the CSS-selector language. Which causes "#param0.typeParameter" to be interpretted as an element with id param0 and class typeParameter.
The jQuery statement is more similar to:
document.querySelector("#param0.typeParameter");

jquery .find() method -- parameter composed of doms joined by comma

I have seen code like this, ajQuery.find() with parameters split by commas, i.e. div, input, select.
newRow.find('div, input, select').each(function() {
......
});
What does it mean? Is it something like "a select input box under div"? I couldn't find official document on this function.
It's a CSS selector. Known as "grouping", it means 'find all div, input and select elements'.
http://www.w3.org/TR/CSS2/selector.html#grouping
The code you provided would look in the object newRow for any div, input or select elements and it would then run the code in the each function for each one it finds.

jquery hasClass, can it be given the beginning of class name, to get the full class name

I'm trying to do something similar to this question, but it's a bit different, so the solution there isn't working for me.
<span class="a-class another-class test-top-left"></span>
I have an element (this code shows a span but it could be div span or anything). This element has a class beginning with test- (test-top-left, test-top-right etc.) I've triggered a click event on classes starting with test- and saved the clicked object as var object = this;. Simple stuff so far.
What I'm trying to do now is get the full name of that class (test-top-left). I know it starts with test- but what's the full name. The thing is that there are other classes a-class another-class and test-top-left. Can hasClass be used to get the full name of the class? I'd prefer not to use find() or filter() just because there may be additional elements within that also have class="test-"
Edit:
The code I have now is, but it gives me ALL the classes. What I need is the single class beginning with test-.
var object = this;
$(object).attr('class');
So now I for loop through all the classes and test each one separately, which seems like a lot of unnecessary code. I'm hoping jQuery has a clever way to get the exact class that was clicked right away.
Description
You can use jQuerys Attribute Contains Selector, .attr() and .click() method.
Attribute Contains Selector - Selects elements that have the specified attribute with a value containing the a given substring.
.attr() - Get the value of an attribute for the first element in the set of matched elements.
.click() - Bind an event handler to the "click" JavaScript event, or trigger that event on an element.
Sample
html
<span class="anyclass test-hello">Hello World</span>​
jQuery
$("[class*='test']").click(function() {
var object = $(this);
alert(object.attr("class").match(/(test-.*?)(?:\s+|$)/)[1])
;});
Check out the updated jsFiddle
Update
If you dont want to use regex you can do this.
$("[class*='test']").click(function() {
var object = $(this);
alert("test-" + object.attr("class").split("test-")[1].split("-"))
;});
​
More Information
jQuery - Attribute Contains Selector
jQuery - .attr()
jQuery - .click()
jsFiddle Demonstration
This should work for you:
var object = this;
var className = object.className.match(/(test-.*?)(?:\s+|$)/)[1];
Class name is the name of the class you are looking for.
If you don't want to use split or regex, you can try having the class in a separate attribute
<span class="someclass test-something" _rel="test-something">test<span>
or
<span class="someclass" _rel="test-something">test<span>
with the script
$("[_rel*='test-']").click(....
And to retrieve the attribute, use $(this).attr("_rel")

jQuery - match element that has a class that starts with a certain string

I have a few links that look like this:
...
How can I bind a function to all elements that have a class that starts with "rotate-" ?
You can use starts with selector like this:
$('a[class^="rotate-"]')
Description: Selects elements that
have the specified attribute with a
value beginning exactly with a given
string.
So your code should be:
$('a[class^="rotate-"]').click(function(){
// do stuff
});
Note: If you want to find out elements that contain certain text anywhere in their attributes, you should do this instead:
$('a[class*="rotate-"]').click(function(){
// do stuff
});

Categories

Resources