A few suggestions.
1. Cache your selector call, then subsequently use that.
var $epc = $('#edit-profile-country')
2. Group your selectors
$('#state, #province').hide();
3. Cache your repeated val calls
var country== $epc.val()
if country == 'CA' ...
if country == 'US' ...
4. Similarly, in the change()
var country= $(this).val()
if country == 'US' ...
if country == 'CA' ...
If the change() is more complex, then this might make sense too
var $this= $(this)
$this.something() ....
$this.somethingElse() ....
**--** Steve
On Apr 4, 8:07 am, John H <[email protected]> wrote:
> I'm not new to web development or javascript, but am relatively new to
> jQuery. I'm wondering if someone would be willing to quickly review
> the following code for efficiency and best practices. The function
> works as required, but I'd like to take this as a learning
> opportunity.
>
> In a nutshell the code initially hides two divs onload and then the
> function shows/hides the state/province divs depending on the value of
> the country dropdown. I want to keep the code readable, but I know it
> could be tighten up.
>
> The state/province divs have a style attribute to initially hide them.
> Exp. style="display: none;"
>
> Questions:
>
> 1) Can the duplicate show/hide methods be reduced?
> 2) What about checking for the existence of the state/province
> dropdowns? (I know they're always going to be there because of the
> context of the page, but want to know what the best practice is.)
>
> $(document).ready(function() {
> // set default div visibility
> if ($('#edit-profile-country').val() == 'US') {
> $('#state').show();
> }
> if ($('#edit-profile-country').val() == 'CA') {
> $('#province').show();
> }
> $('#edit-profile-country').change(function() {
> $('#state').hide();
> $('#province').hide();
> if ($(this).val() == 'US') {
> $('#state').show();
> }
> if ($(this).val() == 'CA') {
> $('#province').show();
> }
> })
> });
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
