Archive for "jQuery"
Jun04A note on DOM elements’ changed scope when using thickbox with jQuery
A similar situation may arise (atleast for me it did) when you try to invoke jQuery’s “thickbox” in conjunction with a custom onclick firing. I would explain it with the help of an example:
I have a div element (with id “myBlockTOShow”, i would say it “#myBlockTOShow” in this post further) which i display/present as a “thickbox” when a href tag/link is clicked. Here is how the div element looks like: Click to continue »
Jun03How to prevent parent’s onclick event from firing when a child tag is clicked with jquery?
Generally, Javascript events bubble (listen) to the highest point in the DOM to which a click event had been attached. So even if you don’t have any other explicitly click-able elements in the div, every child element of the div would bubble their click event up the DOM to until the DIV’s click event handler catches it. Click to continue »
May20Setting Style/CSS of select options using jQuery
This is how i set style (color here) of all of the options of a select list using jQuery.
In my case i had select options like this:
<select id=”select_list_id”>
<option value=”#595959″>Grey</option>
<option value=”#000000″>Black</option>
<option value=”#036″>Blue</option>
<option value=”#363″>Green</option>
<option value=”#632423″>Red</option>
<option value=”#403152″>Purple</option>
<option value=”#E36C0A”>Orange</option>
</select>
Follwoing the jQuery code i used to set color of options above:
$(document).ready(function(){
$('#select_list_id option', this).each(
function () {
$(this).css({'color':$(this).val()});
}
)
});
Jan30Autocomplete=”off” workaround / fix for valid XHTML
Add an onload function similar to the following to <head> section of your web page.
<script type="text/javascript">
function onload_call() {
if (!document.getElementById) return false;
var f = document.getElementById('field_name');
f.setAttribute("autocomplete", "off");
}
</script>
Jan30Checking / Unchecking radio buttons and retrieving their value in jQuery
Let us assume we have radio buttons
<input name="rd_name" id="RD1" value="Value One" /> Label 1 <input name="rd_name" id="RD2" value="Value Two" /> Label 2
To retrieve and set radio button values by id we have the following methods. To retrieve we have, Click to continue »
Jan27How to tell if an element exists with jQuery
For the reference. In general javascript we can check for the existence of an element using the method below:
if(document.getElementById('element_id')) {
//element exists
} else {
//element does not exist
}
Nov27How to position a pop up element on mouse position coordinates with jquery
Here is a simple yet useful trick to position a tooltip (a div element etc) near the mouse click or pointer position using jQuery. In the example here, we have a tool tip (div) with id “tooltip”, a href tag, on clicking which the pop up is positioned and a snippet of code to place anywhere on the page. Obviousaly this small function can be used to return mouse event coordinates by makeing slightest changes.
I have not tested this code jquery version prior to 1.3.2.
So, here is the javascript code:
$(document).ready(function() {
$("#tooltip_link").click(function(e){
var x = e.pageX;
var y = e.pageY;
alert(x +', '+ y);
$("#tooltip").css({"top":y, "left":x, "position":"absolute"});
$(this).unbind('click');
});
}
The code line below is used to stop click event when action is already over:
$(this).unbind('click');
And href and div tag html code:
CLICKOnce there was a man who lived in a forest. He ate in the forest and slept in the forest. He was very happy living in the forest. At last he died in the forest. No one knows why the man lived in the forest. I know this is not a happy story. The end!
Oct30Limitation on the number of characters in jquery ajax response
The following jquery ajax call would return approx. 8442 characters in its “html” response. Content exceeding this number would be truncated. Click to continue »
