Kênh 360 Công Nghệ Kênh 360 độ công nghệ thông tin,tin tức công nghệ, thủ thuật tin học, sản phẩm công nghệ, ngôn ngữ lập trình, mạng truyền thông, cơ sở dữ liệu, công nghệ web, mã nguồn, thiết kế web, prestashop, joomla, tải phần mềm, ebooks, game, drivers http://www.kenh360.com/cntt/phat-trien-web/javascript-2.html Fri, 10 Feb 2012 11:49:54 +0000 Joomla! 1.5 - Open Source Content Management vi-vn Lấy số ngẫu nhiên duy nhất trong javascript http://www.kenh360.com/cntt/thiet-ke-web/javascript/lay-so-ngau-nhien-duy-nhat-trong-javascript.html http://www.kenh360.com/cntt/thiet-ke-web/javascript/lay-so-ngau-nhien-duy-nhat-trong-javascript.html var arr = []
while(arr.length < 8){
 
var randomnumber=Math.ceil(Math.random()*100)
 
var found=false;
 
for(var i=0;i<arr.length;i++){
   
if(arr[i]==randomnumber){found=true;break}
 
}
 
if(!found)arr[arr.length]=randomnumber;
}
Hoặc
function fisherYates(myArray,nb_picks)
{
   
for (i = myArray.length-1; i > 1  ; i--)
   
{
       
var r = Math.floor(Math.random()*i);
       
var t = myArray[i];
        myArray
[i] = myArray[r];
        myArray
[r] = t;
   
}

   
return myArray.slice(0,nb_picks);
}

hoặc

function randomInt(min, max) {
   
return Math.round(min + Math.random()*(max-min));
}
var index = {}, numbers = [];
for (var i=0; i<8; ++i) {
   
var number;
   
do {
        number
= randomInt(1, 100);
   
} while (index.hasOwnProperty("_"+number));
    index
["_"+number] = true;
    numbers
.push(number);
}
delete index;

 implementation array prototype.

// swaps elements at index i and j in array this
// swapping is easy on js 1.7 (feature detection)
Array.prototype.swap = (function () {
   
var i=0, j=1;
   
try { [i,j]=[j,i]; }
   
catch (e) {}
   
if(i) {
       
return function(i,j) {
           
[this[i],this[j]] = [this[j],this[i]];
           
return this;
       
}
   
} else {
       
return function(i,j) {
           
var temp = this[i];
           
this[i] = this[j];
           
this[j] = temp;
           
return this;
       
}
   
}
})();


// shuffles array this
Array.prototype.shuffle = function() {
   
for(var i=this.length; i>1; i--) {
       
this.swap(i-1, Math.floor(i*Math.random()));
   
}
   
return this;
}

// returns n unique random numbers between min and max
function pick(n, min, max) {
   
var a = [], i = max;
   
while(i >= min) a.push(i--);
   
return a.shuffle().slice(0,n);
}

pick
(8,1,100);

hoặc

// removes n random elements from array this
// and returns them
Array.prototype.pick = function(n) {
   
if(!n || !this.length) return [];
   
var i = Math.floor(this.length*Math.random());
   
return this.splice(i,1).concat(this.pick(n-1));
}

// returns n unique random numbers between min and max
function pick(n, min, max) {
   
var a = [], i = max;
   
while(i >= min) a.push(i--);
   
return a.pick(n);
}

pick
(8,1,100);

Source http://stackoverflow.com/questions/2380019/generate-8-unique-random-numbers-between-1-and-100]]>
news@kenh360.com (AdminKenh360com) JavaScript Fri, 23 Sep 2011 09:58:21 +0000
String.Format trong JavaScript http://www.kenh360.com/cntt/thiet-ke-web/javascript/string.format-trong-javascript.html http://www.kenh360.com/cntt/thiet-ke-web/javascript/string.format-trong-javascript.html

Tạo file js mới định nghĩa các hàm

String.js

function _StringFormatInline()
{
	var txt = this;
	for(var i=0;i<arguments.length;i++)
	{
		var exp = new RegExp('\\{' + (i) + '\\}','gm');
		txt = txt.replace(exp,arguments[i]);
	}
	return txt;
}

function _StringFormatStatic()
{
	for(var i=1;i<arguments.length;i++)
	{
		var exp = new RegExp('\\{' + (i-1) + '\\}','gm');
		arguments[0] = arguments[0].replace(exp,arguments[i]);
	}
	return arguments[0];
}

Khai báo prototype

if(!String.prototype.format)
{
	String.prototype.format = _StringFormatInline;
}

if(!String.format)
{
	String.format = _StringFormatStatic;
}

Hai cách gọi hàm:

Static

var str = String.format("This is a {0} string using the {1} method.","formatted","static");

Inline

var str = "This is a {0} string using the {1} method.".format("formatted","inline");

Ví dụ.

<html>
<head>
	<title>String Extend</title>
	<script src="http://www.kenh360.com/cntt/String.js"></script>
	<script>

		var str = String.format("This is {0} story about {0} {1}.","my","dog");
		var str2 = "I have 2 friends, {0} and {1}.".format("Doug","Jane");
		alert(str + "\n\n" + str2);

	</script>
</head>
<body>
</body>
</html>

Enjoy!

String.format = String.prototype.format = function() {

var i=0;
var string = (typeof(this) == “function” && !(i++)) ? arguments[0] : this;

for (; i < arguments.length; i++)
string = string.replace(/\{\d+?\}/, arguments[i]);

return string;
}

hoặc

String.format = function(p_txt){
if ( arguments.length <= 1 ) {
return p_txt;
}
for( var v_idx = 1, v_num = arguments.length; v_idx < v_num; v_idx++ ){
p_txt = p_txt.replace(new RegExp("\\{" + (v_idx – 1) + "\\}", "gi"), arguments[v_idx]);
}
return p_txt;
};

String.prototype.format = function(){
Array.prototype.unshift.apply(arguments, [this]);
return String.format.apply(String, arguments);
};

Source C#’s String.Format For JavaScript

]]>
news@kenh360.com (AdminKenh360com) JavaScript Mon, 19 Sep 2011 09:12:53 +0000
Get Meta Tag content http://www.kenh360.com/cntt/thiet-ke-web/javascript/get-meta-tag-content.html http://www.kenh360.com/cntt/thiet-ke-web/javascript/get-meta-tag-content.html
function GetMetaValue(meta_name) {

var my_arr=document.getElementsByTagName("META");
for (var counter=0; counter<my_arr.length; counter++) {
if (my_arr[counter].name.toLowerCase() == meta_name.toLowerCase()) {
return my_arr[counter].content;
}
}
return "N/A";
}

document.write ("<br />META Description is: "+GetMetaValue('description'));

hoặc
function getMetaContents(mn){
var m = document.getElementsByTagName('meta');
for(var i in m){
if(m[i][i].name == mn){
return m[i].content;
}
}
}

]]>
news@kenh360.com (AdminKenh360com) JavaScript Wed, 01 Jun 2011 08:11:01 +0000
Get window width và window height http://www.kenh360.com/cntt/thiet-ke-web/javascript/get-window-width-va-window-height.html http://www.kenh360.com/cntt/thiet-ke-web/javascript/get-window-width-va-window-height.html GetWidth
function GetWidth()
{
var x = 0;
if (self.innerHeight)
{
x = self.innerWidth;
}
else if (document.documentElement && document.documentElement.clientHeight)
{
x = document.documentElement.clientWidth;
}
else if (document.body)
{
x = document.body.clientWidth;
}
return x;
}
GetHeight
function GetHeight()
{
var y = 0;
if (self.innerHeight)
{
y = self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientHeight)
{
y = document.documentElement.clientHeight;
}
else if (document.body)
{
y = document.body.clientHeight;
}
return y;

}

Nguồn sưu tầm
]]>
news@kenh360.com (AdminKenh360com) JavaScript Tue, 24 May 2011 08:56:38 +0000
Tạo hiệu ứng tuyết rơi, hoa rụng trên website bằng javascript http://www.kenh360.com/cntt/phat-trien-web/javascript/tao-script-tuyet-roi-hoa-rung-bang-javascript.html http://www.kenh360.com/cntt/phat-trien-web/javascript/tao-script-tuyet-roi-hoa-rung-bang-javascript.html Tạo script tuyết rơi
pictureSrc: đường dẫn file ảnh
<!---tuyet roi--->
<script type="text/javascript">
// <![CDATA[
var pictureSrc ="http://img143.imageshack.us/img143/5785/hoamai.png"; // the location of the snowflakes
var pictureWidth = 30; //the width of the snowflakes
var pictureHeight = 30; //the height of the snowflakes
var numFlakes = 10; //the number of snowflakes
var downSpeed = 0.01; //the falling speed of snowflakes (portion of screen per 100 ms)
var lrFlakes = 10; //the speed that the snowflakes should swing from side to side


if( typeof( numFlakes ) != 'number' || Math.round( numFlakes ) != numFlakes || numFlakes < 1 ) { numFlakes = 10; }

//draw the snowflakes
for( var x = 0; x < numFlakes; x++ ) {
if( document.layers ) { //releave NS4 bug
document.write('<layer id="snFlkDiv'+x+'"><imgsrc="http://www.kenh360.com/cntt/'+pictureSrc+'" height="'+pictureHeight+'"width="'+pictureWidth+'" alt="*" border="0"></layer>');
} else {
document.write('<div style="position:absolute;"id="snFlkDiv'+x+'"><img src="http://www.kenh360.com/cntt/'+pictureSrc+'"height="'+pictureHeight+'" width="'+pictureWidth+'" alt="*"border="0"></div>');
}
}

//calculate initial positions (in portions of browser window size)
var xcoords = new Array(), ycoords = new Array(), snFlkTemp;
for( var x = 0; x < numFlakes; x++ ) {
xcoords[x] = ( x + 1 ) / ( numFlakes + 1 );
do { snFlkTemp = Math.round( ( numFlakes - 1 ) * Math.random() );
} while( typeof( ycoords[snFlkTemp] ) == 'number' );
ycoords[snFlkTemp] = x / numFlakes;
}

//now animate
function flakeFall() {
if( !getRefToDivNest('snFlkDiv0') ) { return; }
var scrWidth = 0, scrHeight = 0, scrollHeight = 0, scrollWidth = 0;
//find screen settings for all variations. doing this every time allows for resizing and scrolling
if( typeof( window.innerWidth ) == 'number' ) { scrWidth = window.innerWidth; scrHeight = window.innerHeight; } else {
if( document.documentElement && (document.documentElement.clientWidth ||document.documentElement.clientHeight ) ) {
scrWidth = document.documentElement.clientWidth; scrHeight = document.documentElement.clientHeight; } else {
if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
scrWidth = document.body.clientWidth; scrHeight = document.body.clientHeight; } } }
if( typeof( window.pageYOffset ) == 'number' ) { scrollHeight = pageYOffset; scrollWidth = pageXOffset; } else {
if( document.body && ( document.body.scrollLeft ||document.body.scrollTop ) ) { scrollHeight = document.body.scrollTop;scrollWidth = document.body.scrollLeft; } else {
if(document.documentElement && (document.documentElement.scrollLeft ||document.documentElement.scrollTop ) ) { scrollHeight =document.documentElement.scrollTop; scrollWidth =document.documentElement.scrollLeft; } }
}
//move the snowflakes to their new position
for( var x = 0; x < numFlakes; x++ ) {
if( ycoords[x] * scrHeight > scrHeight - pictureHeight ) { ycoords[x] = 0; }
var divRef = getRefToDivNest('snFlkDiv'+x); if( !divRef ) { return; }
if( divRef.style ) { divRef = divRef.style; } var oPix = document.childNodes ? 'px' : 0;
divRef.top = ( Math.round( ycoords[x] * scrHeight ) + scrollHeight ) + oPix;
divRef.left = ( Math.round( ( ( xcoords[x] * scrWidth ) - (pictureWidth / 2 ) ) + ( ( scrWidth / ( ( numFlakes + 1 ) * 4 ) ) * (Math.sin( lrFlakes * ycoords[x] ) - Math.sin( 3 * lrFlakes * ycoords[x]) ) ) ) + scrollWidth ) + oPix;
ycoords[x] += downSpeed;
}
}

//DHTML handlers
function getRefToDivNest(divName) {
if( document.layers ) { return document.layers[divName]; } //NS4
if( document[divName] ) { return document[divName]; } //NS4 also
if( document.getElementById ) { return document.getElementById(divName); } //DOM (IE5+, NS6+, Mozilla0.9+, Opera)
if( document.all ) { return document.all[divName]; } //Proprietary DOM - IE4
return false;
}

window.setInterval('flakeFall();',100);
// ]]>
</script>
<!---end tuyet roi--->
Nguồn sưu tầm]]>
news@kenh360.com (AdminKenh360com) JavaScript Sat, 18 Dec 2010 17:00:00 +0000
Tự động lấy thông tin thời tiết bằng Javascript http://www.kenh360.com/cntt/phat-trien-web/javascript/tu-dong-lay-thong-tin-thoi-tiet-bang-javascript.html http://www.kenh360.com/cntt/phat-trien-web/javascript/tu-dong-lay-thong-tin-thoi-tiet-bang-javascript.html Tự động lấy thông tin thời tiết bằng Javascript Thông tin về thời tiết là một trong những widget hay được hiển thị nhất trên các website tin tức. Tuy vậy, có nhiều web master không biết cách làm widget này. Tôi thường thấy người ta "mượn tạm" các file javascript hoặc lọc nội dung trên các website nổi tiếng như VnExpress, Dân trí, ... rồi hiện chúng trên website của mình. Cách làm như vậy khiến website của mình phụ thuộc vào các trang đó, đồng thời cũng khó tùy biến. ]]> news@kenh360.com (AdminKenh360com) JavaScript Sat, 02 Oct 2010 04:18:44 +0000 Tạo quả bí ngô Halloween bằng javascript http://www.kenh360.com/cntt/phat-trien-web/javascript/tao-qua-bi-ngo-halloween-bang-javascript.html http://www.kenh360.com/cntt/phat-trien-web/javascript/tao-qua-bi-ngo-halloween-bang-javascript.html news@kenh360.com (AdminKenh360com) JavaScript Thu, 30 Sep 2010 17:00:00 +0000 Lấy số ngày trong một tháng trong Javascript http://www.kenh360.com/cntt/phat-trien-web/javascript/lay-so-ngay-trong-mot-thang-trong-javascript.html http://www.kenh360.com/cntt/phat-trien-web/javascript/lay-so-ngay-trong-mot-thang-trong-javascript.html Lấy số ngày trong một tháng bất kỳ bằng Javascript.
]]>
news@kenh360.com (AdminKenh360com) JavaScript Mon, 13 Sep 2010 17:00:00 +0000
5 Online Rich Text Editors built using jQuery http://www.kenh360.com/cntt/phat-trien-web/javascript/5-online-rich-text-editors-built-using-jquery.html http://www.kenh360.com/cntt/phat-trien-web/javascript/5-online-rich-text-editors-built-using-jquery.html As defined in Wikipedia – “An Online rich-text editor presents a ‘what-you-see-is-what-you-get’ interface for editing rich text within web browsers. The aim is to reduce the learning curve associated with users trying to express their formatting directly as valid HTML markup.”

I was looking out for a few Rich Text Editors built on top of jQuery and here’s a compilation of the ones I found.

jHtmlArea - A simple, light weight, extensible WYSIWYG HTML Editor built on top of jQuery.

jQuery Rich Text Editor

markItUp - markItUp! is a JavaScript plugin built on the jQuery library. It allows you to turn any textarea into a markup editor.

jQuery Rich Text Editor

jWYSIWYG - This plugin is an inline content editor to allow editing rich HTML content on the fly.

jQuery Rich Text Editor

CSS3 jQuery Rich Text Editor - A web based rich text editor written using jQuery and CSS3 that supports embedded fonts

jQuery Rich Text Editor

HTMLBox - HtmlBox is a modern, crossВ browser, interactive, openВ source wysiwyg editor built on top of the excellent JQuery library

jQuery Rich Text Editor

If you know of any other editors built using jQuery, let me know via the comments section.

Source DevCurry.com

]]>
news@kenh360.com (AdminKenh360com) JavaScript Wed, 21 Apr 2010 03:16:17 +0000
Viết ứng dụng (gadget) OpenSocial http://www.kenh360.com/cntt/phat-trien-web/javascript/viet-ung-dung-gadget-opensocial.html http://www.kenh360.com/cntt/phat-trien-web/javascript/viet-ung-dung-gadget-opensocial.html news@kenh360.com (AdminKenh360com) JavaScript Wed, 06 Jan 2010 07:45:17 +0000