<a href> link wont work when loaded with javascript

Question

I have a very small page being managed by some javascript. When I load the page into the browswer the link after the form (id=login_linker) works fine.

However, when I load it into a div the same link wont work. Does anyone have any ideas.

Here is the body of the page that is being included.

<body>
  <p>Forgot your password?</>
  <form name="forgotpassform"  id="forgotpassform" onsubmit="return false;">
    <label for="email">Email: </label>
    <input id="email" type="text" class="searchbox" onfocus="emptyElement('status')" maxlength="35">
 <input type="button" style="margin-top: 15px; position:relative; left:50px;" id="forgotpassbtn" onclick="forgotpass()" value="Send me a new password">
     <br>

  </form>
     <span id="emailstatus"> </span>
     <span id="status"></span>
 <a href="#" id="login_linker" alt="show login">Log In</a>
</body>

The javascript:

function forgotpass(){
    var e = _("email").value;
    var status = _("status");
    var forgotpassform = _("forgotpassform");
    if(e != ""){
        _("forgotpassbtn").style.display = "none";
        status.innerHTML = 'please wait ...';
        var ajax = ajaxObj("POST", "forgotpass.php");
        ajax.onreadystatechange = function() {
            if(ajaxReturn(ajax) == true) {
                if(ajax.responseText == "no_user"){
                    status.innerHTML = 'There was no matching email in the system.';                    
                    _("forgotpassbtn").style.display = "block";
                }  else if(ajax.responseText =="email_not_sent"){
                    status.innerHTML = 'There was a problem sending your temporary password.';      
                } else {
                //status.innerHTML = ajax.responseText;
                forgotpassform.innerHTML = "You have sent a temporary password to your email address. Please check your email.";    
                }
            }
        }
        ajax.send("e="+e);
    } else {
        status.innerHTML = "Please enter your email address.";
    }
}

function emptyElement(x){
    _(x).innerHTML = "";
}

    function loadlogin(){
    $('#loginwindow').toggle(400);

    $('#loginwindow').load("forgotpass.php");
    $('#loginwindow').toggle(400);
}

$(document).ready(function(){
    $(document).on('click', '#login_linker', function(){
    alert('ok');
        showlogin();
    });
    });

function showlogin(){
$('#loginwindow').load("login.php");
$('#loginwindow').toggle(400);
        }

Here is the script to load the forgot password page ie the HTML above

function forgotpass(){
    $('#loginwindow').toggle(400);
    $('#loginwindow').load("forgotpass.php");
    $('#loginwindow').toggle(400);
}

Answer 1

I don't know how your code to load the link using js is (it would be better if you post it too), but I guess the problem is you try to bind the event just after document is ready, and at that moment, the link isn't loaded yet. Bind it after loading it.

<a href> link wont work when loaded with javascript

Question

1 answers

solution1
0 2013-07-30 22:12:46

<a href> link wont work when loaded with javascript

Question

1 answers

solution1 0 2013-07-30 22:12:46

solution1
0 2013-07-30 22:12:46