MAP$.map([10,20,30], function(n,i) { return n+i;}); //[10, 21, 32]
Jquery Reverse Order of Child Elements (ul & li):
var list = $('ul');
var listItems = list.children('li');
list.append(listItems.get().reverse());
$('ul li')[0] //<li>AAA</li>
$('ul li')[0].innerHTML //AAA
$("ul li").eq(7).css("border", "1px solid #000000"); //Applies style to 8th element
Apply Style to Even & Odd rows:
$("ul li:even").addClass("even");
$("ul li:odd").addClass("odd");
(or)
$("ul li").each(function(i) {
if (i % 2 == 1)
{
$(this).addClass("odd"); //$(this).css("background-color", 'red')
}
else
{
$(this).addClass("even"); //$(this).css("background-color", 'yellow')
}
})
;
if ($('#elem').is(':hidden')) {
// Do something conditionally
}
$('p:visible').hide(); // Hiding only elements that are currently visible
$('ul').siblings().length //Siblings of <ul> element
To Get Immediate Children
<a href="/category">Category</a>
<ul id="nav">
<li><a href="#anchor1">Anchor 1</a></li>
<li><a href="#anchor2">Anchor 2</a></li>
<li><span><a href="#anchor3">Anchor 3</a></span></li>
</ul>
$('li > a').length => 2 (only in immediate direct children)
$('li a').length => 3 (all anchor tags )
$('li').children()
or
$('li > *')
or
$('li').find('> *')
Stop Event Bubbling:
return false; => event.stopPropagation(); + event.preventDefault();
event.stopImmediatePropagation(); => stops immediately without executing handlers of same element.
event.stopPropagation(); => stops executing handlers of parent elements, but executes that of same element
end()
You can return to the previous set of DOM elements that were selected before using a destructive method.
<p>text 1 </p>
<p class="test_class">text 2
<span>AAA</span>
</p>
<p>text 3 </p>
<script type="text/JavaScript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/JavaScript">
console.log($('p').filter('.test_class').length); // 1
console.log($('p').filter('.test_class').end().length); // 3
console.log($('p').filter('.test_class').find('span').end().end().length); // 3
</script>
filter() vs find()
find() will operates the children of the current set
filter() will only operate on the current set of elements.
On the same level: (FILTER)$('div').filter('.x').length
or
$('div.x').text()
Inner level search (FIND)$('div').find('.x').length
or
$('div .x').text()
Jquery - Save File:
$('#ajax-loader').show();
$.post("/test/return/data/", snddata,
function callbackHandler(data, textstatus){
$('#ajax-loader').hide();
if(data.status == 1){
str = data.encrypted_data
saveData(str, "download_file_name")
}
else{
alert(data.msg);
}
},
"json"
);
var saveData = (function () {
var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
return function (data, fileName) {
var json = data,
blob = new Blob([json], {type: "octet/stream"}),
url = window.
URL.createObjectURL(blob);
a.href = url;
a.
download = fileName;
a.click();
window.URL.
revokeObjectURL(url);
};
}());
& issues while passing from template to server
str = ''
document.location = '/test/url/' + encodeURIComponent(str);
!important
!important (It will override the CSS definition in header classes)
<style type="text/css">
.bst_popover{
max-width: 500px !important;
}
</style>
Choose a specific parent$(this).parents("tr:first");
$(this).closest("tr");
