SitePoint Sponsor

User Tag List

Page 4 of 5 FirstFirst 12345 LastLast
Results 76 to 100 of 112
  1. #76
    SitePoint Zealot Rexibit's Avatar
    Join Date
    Jul 2008
    Location
    United States
    Posts
    178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wow, very nice guys. I am going to be referencing this as I read a beginner's JavaScript book that I got from Sitepoint a couple weeks ago.
    Rexibit Web Services
    Don't just build it - CSS it

  2. #77
    SitePoint Member
    Join Date
    Aug 2008
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i am currently studying javascript and thanks that i have viewed your threads... it helps me a lot and i have learned very much

  3. #78
    SitePoint Member
    Join Date
    Aug 2008
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm newbies and try to do website with html and java.

  4. #79
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Java could be making hard work for yourself. Javascript is much more suited for websites.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #80
    SitePoint Member
    Join Date
    Apr 2008
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    can someone tell me where i can find good javascript libraries???

  6. #81
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Near the top of the javascript forum is an article called JavaScript Library Summary
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #82
    SitePoint Member
    Join Date
    Sep 2008
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you my friend

  8. #83
    SitePoint Member nacker4it's Avatar
    Join Date
    Mar 2008
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There are lot of tips and tricks available on internet about the internet.
    google is best friend if someone search this keyword in google "javascripts tips and tricks"

  9. #84
    SitePoint Enthusiast
    Join Date
    Jan 2009
    Location
    Michigan
    Posts
    70
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    function checkName() {
    	if (document.form.VisitorName.value=="") {
    		alert("you must provide your name");
    		return false;
    	}
    	if (document.form.VisitorName.value.length < 2) {
    		alert("please enter your real name");
    		return false;
    	}
    	return true;
    }
    function checkPhoneEmail() {
    		
    	if ((document.form.VisitorEmail.value=="" || document.form.VisitorEmail.value==null) && 
    		 (document.form.VisitorPhone.value=="" || document.form.VisitorPhone.value==null)) {
    		alert("You must fill in  Phone or Email");
    		return false;
    	}
    	if ((document.form.VisitorEmail.value!="") && (document.form.VisitorEmail.value!=null)){
    			if (!ValidateEmail()){
    					return false;
    			}
    		}
    	if ((document.form.VisitorPhone.value!="") && (document.form.VisitorPhone.value!=null)){
    			if (!ValidatePhone()){
    				return false;
    			}
    		}
    	return true;
    }
    
    
    
    
    
    //		||---------Email Checker --------------||
    //check to make sure email has a @ and a . and that they are in legit places
    function echeck(str) {
    
    		var at="@"
    		var dot="."
    		var lat=str.indexOf(at)
    		var lstr=str.length
    		var ldot=str.indexOf(dot)
    		if (str.indexOf(at)==-1){
    		   alert("Invalid E-mail Address")
    		   return false
    		}
    
    		if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
    		   alert("Invalid E-mail Address")
    		   return false
    		}
    
    		if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
    		    alert("Invalid E-mail Address")
    		    return false
    		}
    
    		 if (str.indexOf(at,(lat+1))!=-1){
    		    alert("Invalid E-mail Address")
    		    return false
    		 }
    
    		 if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
    		    alert("Invalid E-mail Address")
    		    return false
    		 }
    
    		 if (str.indexOf(dot,(lat+2))==-1){
    		    alert("Invalid E-mail Address")
    		    return false
    		 }
    		
    		 if (str.indexOf(" ")!=-1){
    		    alert("Invalid E-mail Address")
    		    return false
    		 }
    
     		 return true					
    	}
    
    function ValidateEmail(){
    	var emailID=document.form.VisitorEmail
    	
    	if ((emailID.value==null)||(emailID.value=="")){
    		alert("Please Enter a Valid Email Address")
    		emailID.focus()
    		return false
    	}
    	if (echeck(emailID.value)==false){
    		emailID.value=""
    		emailID.focus()
    		return false
    	}
    	return true
     }
    
    
    
    
    
    
    //		||-----------Phone Checker -----------||
    // Declaring required variables
    var digits = "0123456789";
    // non-digit characters which are allowed in phone numbers
    var phoneNumberDelimiters = "()- ";
    // characters which are allowed in international phone numbers
    // (a leading + is OK)
    var validWorldPhoneChars = phoneNumberDelimiters + "+";
    // Minimum no of digits in an international phone no.
    var minDigitsInIPhoneNumber = 10;
    
    function isInteger(s)
    {   var i;
        for (i = 0; i < s.length; i++)
        {   
            // Check that current character is number.
            var c = s.charAt(i);
            if (((c < "0") || (c > "9"))) return false;
        }
        // All characters are numbers.
        return true;
    }
    function trim(s)
    {   var i;
        var returnString = "";
        // Search through string's characters one by one.
        // If character is not a whitespace, append to returnString.
        for (i = 0; i < s.length; i++)
        {   
            // Check that current character isn't whitespace.
            var c = s.charAt(i);
            if (c != " ") returnString += c;
        }
        return returnString;
    }
    function stripCharsInBag(s, bag)
    {   var i;
        var returnString = "";
        // Search through string's characters one by one.
        // If character is not in bag, append to returnString.
        for (i = 0; i < s.length; i++)
        {   
            // Check that current character isn't whitespace.
            var c = s.charAt(i);
            if (bag.indexOf(c) == -1) returnString += c;
        }
        return returnString;
    }
    
    function checkInternationalPhone(strPhone){
    var bracket=3
    strPhone=trim(strPhone)
    if(strPhone.indexOf("+")>1) return false
    if(strPhone.indexOf("-")!=-1)bracket=bracket+1
    if(strPhone.indexOf("(")!=-1 && strPhone.indexOf("(")>bracket)return false
    var brchr=strPhone.indexOf("(")
    if(strPhone.indexOf("(")!=-1 && strPhone.charAt(brchr+2)!=")")return false
    if(strPhone.indexOf("(")==-1 && strPhone.indexOf(")")!=-1)return false
    s=stripCharsInBag(strPhone,validWorldPhoneChars);
    return (isInteger(s) && s.length >= minDigitsInIPhoneNumber);
    }
    
    function ValidatePhone(){
    	var Phone=document.form.VisitorPhone
    	
    	if ((Phone.value==null)||(Phone.value=="")){
    		alert("Please Enter your Phone Number ex: 555-555-5555")
    		Phone.focus()
    		return false
    	}
    	if (checkInternationalPhone(Phone.value)==false){
    		alert("Please Enter a Valid Phone Number ex: 555-555-5555")
    		Phone.value=""
    		Phone.focus()
    		return false
    	}
    	return true
     }
    
    
    function CheckAll(){
    	if (checkName() &&	checkPhoneEmail()) {
    		return true;
    		}
    		else
    		{
    			return false;
    		}
    	
    }
    HTML :
    HTML Code:
    <form name="form" action="<?php echo $_SERVER['PHP_SELF'];?>" method="POST" onSubmit="return CheckAll();">
    be sure to name the "name" property of input fields accordingly:
    Name input should be "VisitorName"
    Email input should be "VisitorEmail"
    Phone input should be "VisitorPhone"

    hope it helps!
    J

  10. #85
    SitePoint Member
    Join Date
    Jan 2009
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Jquery Ajax Made Easy

    Feel free to add comments and corrections, I will update the post with the good ones.

  11. #86
    SitePoint Member
    Join Date
    Oct 2009
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How do you comment out code? Using /*...*/? Using your IDE to put // before each line? There is a third method:
    view source
    print?
    1.if (0 == 1) {
    2. ... code ...
    3.}

    Pros:

    * Nests
    * You need only change a single character to “flip” the comment: Replace the 0 with 1.
    * You won’t get warnings because of suddenly unused imports or local variables.
    * The Java compiler will remove this block of code in the optimization step, so no runtime penality.

    Cons:

    * Can only be used inside of methods.

    If you need a fast way to repeatedly comment in/out a piece of code elsewhere, use this syntax:
    view source
    print?
    1.//* Fast flip comment starts here
    2. ... code ...
    3./* and ends here */

    Inside of a /*...*/ comment, the sequence “/*” has no special meaning. To comment out the block of code, remove the first “/” in “//*”:
    view source
    print?
    1./* Fast flip comment starts here
    2. ... code ...
    3./* and ends here */

  12. #87
    SitePoint Zealot evilunix's Avatar
    Join Date
    Jun 2008
    Location
    York, UK.
    Posts
    114
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Rather than always doing document.getElementById you can save a lot of space by creating a shortcut function like so:

    Code JavaScript:
    function $(id) {
       if(document.getElementById) return document.getElementById(id);
       return null;
    }

  13. #88
    SitePoint Member
    Join Date
    Dec 2009
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by beetle View Post
    Fair enough. I just wanted to make sure those reading this understood possible complications - particularly because using window.onload = functionName; is one of if not THE primary cause of javascript conflicts.

    In the end, the ability to aggregate events is the most desirable choice - but the tech isn't quite there yet to make it a "best" solution.
    may i know the difference between following two script code segments :

    1) <script type="text/javascript">
    (markMenuSelection('cd','cds'))();
    </script>
    this above code is posted at the end of my jsp page .. and markMenuSelection('cd','cds') is a function defined in a script file included in my jsp.

    2) <script type="text/javascript">
    window.onload=markMenuSelection('cd','cds');
    </script>
    this above code is as well posted at the end of my jsp page .. and markMenuSelection('cd','cds') is a function defined in a script file included in my jsp.

  14. #89
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by vsa1234 View Post
    may i know the difference between following two script code segments :

    1) <script type="text/javascript">
    (markMenuSelection('cd','cds'))();
    </script>
    this above code is posted at the end of my jsp page .. and markMenuSelection('cd','cds') is a function defined in a script file included in my jsp.
    Placing a script just before the </body> tag runs the script as soon as the DOM is ready. This is commonly before the page even appears on the web browser, and is long before images and other parts of the page finish loading.

    Quote Originally Posted by vsa1234 View Post
    2) <script type="text/javascript">
    window.onload=markMenuSelection('cd','cds');
    </script>
    this above code is as well posted at the end of my jsp page .. and markMenuSelection('cd','cds') is a function defined in a script file included in my jsp.
    The onload event waits until the page has fully completed loading, which includes waiting for every single image and piece of the page content.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  15. #90
    SitePoint Member
    Join Date
    Dec 2009
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by pmw57 View Post
    Placing a script just before the </body> tag runs the script as soon as the DOM is ready. This is commonly before the page even appears on the web browser, and is long before images and other parts of the page finish loading.



    The onload event waits until the page has fully completed loading, which includes waiting for every single image and piece of the page content.
    thanks pmw57

    but i need the difference between the way i have declared/calling my "markMenuSelection" function. caus i didn't find any difference when i ran the code..it acted the same way with both methods.. any help would help me a greatly understand the function working in javascript

    thanks again

  16. #91
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by vsa1234 View Post
    thanks pmw57

    but i need the difference between the way i have declared/calling my "markMenuSelection" function. caus i didn't find any difference when i ran the code..it acted the same way with both methods.. any help would help me a greatly understand the function working in javascript

    thanks again
    The difference is that placing the script just before the </body> causes the script to be capable of accessing page elements much faster than if you use the onload technique.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  17. #92
    SitePoint Member
    Join Date
    Dec 2009
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by pmw57 View Post
    The difference is that placing the script just before the </body> causes the script to be capable of accessing page elements much faster than if you use the onload technique.
    thanks pmw57,

    so should I assume that apart from the difference in the way they are loaded there is no difference the way they are are called or something like that caus i got a bit confuse with the syntax "(markMenuSelection('cd','cds')();" could you put more light on this particular way or syntx of accessing functions.

    thanks a lot

  18. #93
    SitePoint Member
    Join Date
    Dec 2009
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by vsa1234 View Post
    thanks pmw57,

    so should I assume that apart from the difference in the way they are loaded there is no difference the way they are are called or something like that caus i got a bit confuse with the syntax "(markMenuSelection('cd','cds')();" could you put more light on this particular way or syntx of accessing functions.

    thanks a lot
    sorry the syntax was like below:

    "(markMenuSelection('cd','cds'))();"

  19. #94
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    At the end of the document it could just be:

    Code javascript:
    markMenuSelection('cd','cds');

    as is normal with all functions.

    What you have there is an anonymous closure

    Code javascript:
    (function () {
        ...
    }());

    Others use this syntax, but it is less correct than the above:

    Code javascript:
    (function () {
        ...
    })();

    The purpose of an anonymous closure is twofold. First, other code outside of the closure is not normally able to access the code inside, and second, the functions inside the anonymous closure don't pollute the global namespace.

    How do they normally pollute the global namespace? Take a normal function for example:

    Code javascript:
    function doSomething() {
     
    }
    alert(window.doSomething); // function () {}

    The function has been added to the global namespace (the window object), and is always accessible from there.

    Now with the anonymous closure wrapped around it.

    Code javascript:
    (function () {
        function doSomething() {
     
        }
        alert(window.doSomething); // undefined
    }());

    The global namespace (the window object) is protected from being polluted by the code within the anonymous closure.

    That is the point and the benefit of using that technique.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  20. #95
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by vsa1234 View Post
    sorry the syntax was like below:

    "(markMenuSelection('cd','cds'))();"
    The syntax as you have it there will not provide any benefit for you. You may as well just use:

    Code javascript:
    markMenuSelection('cd','cds');
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  21. #96
    SitePoint Member
    Join Date
    Dec 2009
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by pmw57 View Post
    The syntax as you have it there will not provide any benefit for you. You may as well just use:

    Code javascript:
    markMenuSelection('cd','cds');
    thanks a lot for that..

  22. #97
    SitePoint Member
    Join Date
    Feb 2010
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    These code are really very helpful thanks for sharing...

  23. #98
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,109
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    An example of how to use the closest thing to a class with private and public members in Javascript:
    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>
    <body>
    <div id="FooManChoo"></div>
    <script type="text/javascript">
    $ = function(id) { return document.getElementById(id);};
     
    var Foo = function(id, options)  {
     
    	// private variables
    	var elm = $(id),
    	favouriteBeer = 'Pale Ale';
     
    	elm.Foo = this; // reference to object so you can access public properties
     
    	// public variables
    	this.beer = false;
     
    	// private function
    	function bar() { alert('Private Bar stocks ' + favouriteBeer); }
     
    	// public function
    	this.bar = function() {
    		bar();
    		this.beer ? alert('Public bar has Beer :) !') : alert('Public bar has no Beer :(');
    	}
    };
     
    new Foo('FooManChoo');
    with ($('FooManChoo').Foo) {
    	bar();
    	beer = true;
    	bar();
    }
    </script>
    </body>
    </html>

  24. #99
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,109
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    I thought I'd put up a sort of a base for a modern javascript library that JimmyP showed me, it's helped me to understand quite a few new techniques so I hope it helps someone else:

    Code javascript:
    var $ = (function() {
     
    	// utility functions
    	var push = [].push,
    	emptyFunction = function() {},
    	extend = function(destination, source) {
    	  	for (var property in source || {}) destination[property] = source[property];
    		return destination;
    	},
     
    	// constructor
    	$ = function(elm) {
    		return new ElementList(elm);
    	},
     
    	// wrapper object
    	ElementList = function(elm) {
    		elm = elm.nodeName ? [elm] : elm;
    		push.apply(this, elm);
    		return this;
    	};
     
    	// wrapper functions
    	ElementList.prototype = {
    		each: function(fn) {
    			for (var i = 0, l = this.length; i < l; i++) {
    				fn.call(this[i],this[i]);
    			}
    			return this;
    		}
     
    		// example function
    		setStyle: function(styles) {
    			return this.each(function() {
    				extend(this.style, styles);
    			});
    		}
     
    	};
     
    	// Native object extensions
    	String.prototype.format = function() {
    		var pattern = /\{\d+\}/g, args = arguments;
    		return this.replace(pattern, function(capture){ return args[capture.match(/\d+/)]; });
    	}
     
    	return $;
     
    })();

    $ seems to be the standard name for the 'swiss army knife' type function that is the entry point to a library.

    Most libraries limit the scope of their code with a self-executing function:
    Code javascript:
    var $ = (function() {
      // vars in here won't pollute the global namespace
    })();
    The extend function is also very popular - It copies all the properties/functions from one object to another.
    Code javascript:
    function extend(destination, source) {
            source || {};
            for (var property in source) {
                    destination[property] = source[property];
            }
            return destination;
    }
    jQuery has made popular the use of a wrapper object around a collection of HTML Elements. The wrapper object in my example is called ElementList which we create in the constructor.
    Code javascript:
      return new ElementList(elm);
    We can make our wrapper element act like an array by borrowing methods from the Array prototype object.
    The apply and call keywords are used to run a function with a different 'this' value, in our case we are using apply to add a collection of HTML Elements to our wrapper object.
    Another trick in here is that we are accepting multiple types of objects in our constructor.
    If the passed in object has a nodeName property we know it's a single HTML element so we turn it into an array to ensure that the object is always an array of HTMLElements.
    Code javascript:
    var push = Array.prototype.push;
     
    // wrapper object
    ElementList = function(elm) {
    	elm = elm.nodeName ? [elm] : elm;
    	push.apply(this, elm);
    	return this;
    };
    The prototype object has already been covered in this thread but it's used for two purposes above:
    housing our wrapper objects functions
    Extending the native prototypes

    I've added a format method to strings which behaves like the .NET String.Format method.
    Code javascript:
    '{0} is {1}'.format('Javascript', 'Cool!'); // 'Javascript is Cool!'

  25. #100
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,109
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Oh, and chaining of functions is achieved by returning the ElementList wrapper in all of it's functions. e.g.
    Code javascript:
    $('p').addClass('foo').animate('bar');

    All the best,


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •