current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

Since few hours I tried to make a script which will show a div when the window.location.hash is set up. When the page is ready the script works but when I try to call it with jQuery event .click() it doesnt work.

The code:

var bodyHeight = $('body').height();
$(asd);
function asd() {
locationHash = window.location.hash.replace(/^#!/, '');
if(locationHash != "") {
    $('div#bgLayer').css({
        'height': bodyHeight,
        'display': 'block'
    });
    $('div#feedBack').css('display', 'block');
    $('div#bgLayer, div#feedBackRight').click(function() {
        var clientName = "";
        var clientEmail = "";
        var clientWebsite = "";
        var clientImage = "";
        var clientFeedBack = "";
        $('div#bgLayer').css('display', 'none');
        $('div#feedBack').css('display', 'none');
        $('div#feedBacks').css('display', 'block');
        $('div#feedBackForm').css('display', 'none');
        $('a#showFeedBacks').css('font-weight', 'bold');
        $('h3#clientsAboutUs').css('display', 'inline-block');
        $('h3#addFeedBackAboutUs').css('display', 'none');
        $('div.pages').css('display', 'block');
        $('a#addFeedBack').css('font-weight', 'normal');
        window.location.hash = '!';
    });
    if(locationHash == 'addFeedBack') {
        $('div#feedBacks').css('display', 'none');
        $('h3#clientsAboutUs').css('display', 'none');
        $('h3#addFeedBackAboutUs').css('display', 'inline-block');
        $('div.pages').css('display', 'none');
        $('div#feedBackForm').css('display', 'block');
        $('a#showFeedBacks').css('font-weight', 'normal');
        $('a#addFeedBack').css('font-weight', 'bold');
        $('input#submitFeedBack').attr('disabled', 'disabled');
    }
    else if(locationHash == 'showFeedBacks') {
        $('div#feedBackForm').css('display', 'none');
        $('h3#clientsAboutUs').css('display', 'inline-block');
        $('h3#addFeedBackAboutUs').css('display', 'none');
        $('div.pages').css('display', 'block');
        $('div#feedBacks').css('display', 'block');
        $('a#addFeedBack').css('font-weight', 'normal');
        $('a#showFeedBacks').css('font-weight', 'bold');
    }
}
}
$('#addFeedBack-page').click(asd);

The #addFeedBack-page is:

<a href="#!addFeedBack" id="addFeedBack-page" class="buttons" title="Click me">Click me</a>

So how to make it right?

Best regards, George!

share|improve this question
    
what does the second line of your script accomplish? i have never seen that. –  jbabey Mar 8 '12 at 4:40

3 Answers 3

up vote 1 down vote accepted 
var bodyHeight = $('body').height();
$(document).ready(function () {
     asd();
     $('#addFeedBack-page').click(function(){

        asd();

     });
});

function asd() {
locationHash = window.location.hash.replace(/^#!/, '');
if(locationHash != "") {
    $('div#bgLayer').css({
        'height': bodyHeight,
        'display': 'block'
    });
    $('div#feedBack').css('display', 'block');
    $('div#bgLayer, div#feedBackRight').click(function() {
        var clientName = "";
        var clientEmail = "";
        var clientWebsite = "";
        var clientImage = "";
        var clientFeedBack = "";
        $('div#bgLayer').css('display', 'none');
        $('div#feedBack').css('display', 'none');
        $('div#feedBacks').css('display', 'block');
        $('div#feedBackForm').css('display', 'none');
        $('a#showFeedBacks').css('font-weight', 'bold');
        $('h3#clientsAboutUs').css('display', 'inline-block');
        $('h3#addFeedBackAboutUs').css('display', 'none');
        $('div.pages').css('display', 'block');
        $('a#addFeedBack').css('font-weight', 'normal');
        window.location.hash = '!';
    });
    if(locationHash == 'addFeedBack') {
        $('div#feedBacks').css('display', 'none');
        $('h3#clientsAboutUs').css('display', 'none');
        $('h3#addFeedBackAboutUs').css('display', 'inline-block');
        $('div.pages').css('display', 'none');
        $('div#feedBackForm').css('display', 'block');
        $('a#showFeedBacks').css('font-weight', 'normal');
        $('a#addFeedBack').css('font-weight', 'bold');
        $('input#submitFeedBack').attr('disabled', 'disabled');
    }
    else if(locationHash == 'showFeedBacks') {
        $('div#feedBackForm').css('display', 'none');
        $('h3#clientsAboutUs').css('display', 'inline-block');
        $('h3#addFeedBackAboutUs').css('display', 'none');
        $('div.pages').css('display', 'block');
        $('div#feedBacks').css('display', 'block');
        $('a#addFeedBack').css('font-weight', 'normal');
        $('a#showFeedBacks').css('font-weight', 'bold');
    }
}
}
share|improve this answer
up vote 1 down vote

You want to bind the click handler inside the document.ready event.

So change your code to:

var bodyHeight = $('body').height();
$(function () {
     asd();
     $('#addFeedBack-page').click(asd);
});

function asd() {
    // same as you have it...
}
share|improve this answer
    
My code is: "$(document).ready(function() { var bodyHeight = $('body').height(); $(asd); function asd() {...} $('#addFeedBack-page').click(asd);" –  T0m3kk Mar 8 '12 at 4:20
    
@T0m3kk $(<function>) is the same as $(document).ready(<function>), so your $(asd) code actually binds that function to run on document.ready, which has already happened, so it fires straight away. –  GregL Mar 8 '12 at 4:55
up vote 0 down vote

if you change the html of your current page by using jquery,

normally i would suggest you to use

jQuery(document).ready(function () {
   $('#addFeedBack-page').live("click",function(){

   //action goes here

   });
});
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.