Quantcast
Channel: User Brett Merrifield - Stack Overflow
Viewing all articles
Browse latest Browse all 37

Javascript/Jquery - Don't repeat yourself

$
0
0

I've seen this so many times on the internet. People say to don't repeat yourself in programming languages. I wrote this script for my webpage but I repeated myself quite a bit.

Is it really that big of a deal?

Should I make a function?

How do I do it?

var active = '.teachers';var disabled = '.teacher-link';var width = $('.teachers .staff-outer-container').children().size() * 180;$('.staff-outer-container').css('width', width +'px');$('.teacher-link').click(function() {    if (active != '.teachers') {        $(active).hide();        active = '.teachers';        $(active).show();        width = $('.teachers .staff-outer-container').children().size() * 180;        $('.teachers .staff-outer-container').css('width', width +'px');        $(disabled).removeClass('active').addClass('clickable');        disabled = this;        $(disabled).removeClass('clickable').addClass('active');        $('#type').text('Teachers');    }});$('.admin-link').click(function() {    if (active != '.administrators') {        $(active).hide();        active = '.administrators';        $(active).show();        width = $('.administrators .staff-outer-container').children().size() * 180;        $('.administrators .staff-outer-container').css('width', width +'px');        $(disabled).removeClass('active').addClass('clickable');        disabled = this;        $(disabled).removeClass('clickable').addClass('active');        $('#type').text('Administrators');    }});$('.support-link').click(function() {    if (active != '.support') {        $(active).hide();        active = '.support';        $(active).show();        width = $('.support .staff-outer-container').children().size() * 180;        $('.support .staff-outer-container').css('width', width +'px');        $(disabled).removeClass('active').addClass('clickable');        disabled = this;        $(disabled).removeClass('clickable').addClass('active');        $('#type').text('Support Staff');    }});

editThanks for everyone's input! I'm confused on how to implement these functions. This is what I got: $('.teacher-link').click(handle_click('.teachers', 'Teachers')); I tried this out and it didn't work.Also where do I place the function? Do I place it inside or outside $(document).ready ? Is it best to put functions at the start or the end of my script?


Viewing all articles
Browse latest Browse all 37

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>