How to check jQuery version

Details
Written by: Stanko Milosev
Category: jQuery
Hits: 4381

In console write:

$.fn.jquery

From here.

Few event examples

Details
Written by: Stanko Milosev
Category: jQuery
Hits: 4737

HTML:

<!DOCTYPE html>
<html>

	<head>
		<script type="text/javascript" src="/jquery-2.1.1.js"></script>
		<script type="text/javascript" src="/index.js"></script>
	</head>

	<body>
		<input class="myInput" placeholder="some text">
		<p/>
		<a class="myHref" href="http://www.milosev.com">Test</a>
		<div class="log"></div>
	</body>
	
</html>

JS:

window.onload = function() {
	$(".myInput").focusout(function() {
		$(".log").html($(".log").html() + " I am out of focus <br/>");
	});
	
	$(".myInput").focus(function() {
		$(".log").html($(".log").html() + " I am focused <br/>");
	});
	
	$(".myHref").mouseenter(function() {
		$(".log").html($(".log").html() + " Mouse enter <br/>");
	});
	
	$(".myHref").mouseleave(function() {
		$(".log").html($(".log").html() + " Mouse leave <br/>");
	});
	
	$(".myInput").change(function (handler) {
		$(".log").html($(".log").html() + "I am changed, and the value is: " + $(".myInput").val() + "<br/>")
	});	
	
	$(".myInput").keypress(function (handler) {
		$(".log").html($(".log").html() + "Key code: " +  handler.keyCode + "<br/>")
	});
	
	$(".myInput").on('input', $(".myInput"), function() {
		$(".log").html($(".log").html() + "Input called, and value is: " +  $(".myInput").val() + "<br/>")
	});	
}

Example download from here.

Slider

Details
Written by: Stanko Milosev
Category: jQuery
Hits: 4732

Here you can download my example of the slider.

HTML:

<!DOCTYPE html>
<html>

	<head>
		<script type="text/javascript" src="/index.js"></script>
		<script type="text/javascript" src="/knockout-3.2.0.js"></script>
		<script type="text/javascript" src="/jquery-2.1.1.js"></script>
		<script type="text/javascript" src="/jquery-ui.js"></script>
		<link href="/jquery-ui.css" rel="stylesheet"></link>
	</head>

	<body onload="startSlider()">
		<h2 class="demoHeaders">Slider</h2>
		<div id="slider"></div>
	</body>

</html>

JS:

var startSlider = function () {
	$( "#slider" ).slider({
		range: "min"
	});
}

Example taken from here, and here.

HTML5 example:

<!DOCTYPE html>
<html>

	<head>
	</head>

	<body>
		<input type="range" name="points" min="0" max="10">
	<body>
	
</html>

Example taken from here.

Change page in the middle of Ajax request

Details
Written by: Stanko Milosev
Category: jQuery
Hits: 4352

So, I had a problem where ajax call was started, but user changed the page, and after ajax call was finished some js script will be executed and inf bubble will be shown to the user, in a place where it shouldn't be.

To check if page has changed you can use hash of a page:

$(window).hashchange(function () {
	self.xhr.abort();
	console.log("abort");
});

Test self.xhr.abort() is actually aborting ajax call...

  1. Checking whether a click event was triggered by physically mouse clicking or not
  2. Do not select hidden type
  3. Change form post method
  4. Send a string

Subcategories

Ajax

JavaScript

ExtJS


jQuery

Bing Maps AJAX Control, Version 7.0

Knockout

Jasmine

Moment

node.js

Page 11 of 24