Question

html form-

<div class="inner-container login-panel id="login_form"">
  <h3 class="m_title">SIGN IN YOUR ACCOUNT TO HAVE ACCESS TO DIFFERENT FEATURES</h3>
  <div id="login_form" class="loginform">
    <a href="#" class="create_account" onClick="ppOpen('#register_panel', '280');">CREATE ACCOUNT</a>
    <input type="text" id="email" name="email" class="inputbox" placeholder="Email">
    <input type="password" id="password" name="password" class="inputbox" placeholder="Password">
    <button  id="loginsubmit" class="btn btn-red">LOG IN</button>
    <a href="#" class="login_facebook">login with facebook</a>
  </div>
  <div class="links">
    <a href="#" onClick="ppOpen('#forgot_panel', '350');">FORGOT YOUR USERNAME?</a> / <a href="#" onClick="ppOpen('#forgot_panel', '350');">FORGOT YOUR PASSWORD?</a>
  </div>
</div>

和javascript代码 -

 console.log("before");
 $(document).ready(function (){
    console.log("then");
    $("#loginsubmit").click(function (){
        console.log("success");
        e = $("#email").val();
        p = $("#pass").val();
        if($("#email").val()==""||$("#pass").val()==""){
            $("div#ack").html("please enter email and pass");
           }
        else {
            $.post( $("#myForm").attr("action"), 
                    //$("#myForm :input").serializeArray(),
                    {emailid: e, password: p},
                    function(data){
                        $("div#ack").html(data);
                    });
             }       
        $("#myForm").submit( function(){
            return false;
        });
     });
 });

在控制台之前和之后打印，但点击#loginsubmit时没有响应。 javascript代码有什么问题吗？请帮我找出来。

Answer 1

您的代码正在运行您没有使用#ack id编写div元素，如果要添加此元素，您可以在按钮单击时看到响应。

Answer 2

html：<button id="loginsubmit" class="btn btn-red" onclick="logincheck()">LOG IN</button>

Javascript：

function logincheck(){
    console.log("success");
    e = $("#email").val();
    p = $("#pass").val();
    if($("#email").val()==""||$("#pass").val()=="")
        $("div#ack").html("please enter email and pass");
    else
        $.post( $("#myForm").attr("action"), 
                //$("#myForm :input").serializeArray(),
                {emailid: e, password: p},
                function(data){
                    $("div#ack").html(data);
                });
    $("#myForm").submit( function(){
        return false;
    });

}

现在它正常运作。

Answer 3

请使用以下更新的脚本和html：

的javascript：

console.log("before");
$(document).ready(function (){    
    console.log("then");
    $("#loginsubmit").click(function (){
        console.log("success");
        e = $("#email").val();
        p = $("#pass").val();
        if($("#email").val()==""||$("#pass").val()==""){
            $("div#ack").html("please enter email and pass");
        }
        else {
            $.post( $("#myForm").attr("action"), 
            //$("#myForm :input").serializeArray(),
            { emailid:e, password:p },
                function(data){
                    $("div#ack").html(data);
                },'json');
            }       
            $("#myForm").submit( function(){
                return false;
            });
        });
});

HTML：

<div class="inner-container login-panel id="login_form"">    
    <h3 class="m_title">SIGN IN YOUR ACCOUNT TO HAVE ACCESS TO DIFFERENT FEATURES</h3>
    <form action="#" method="post" id="myForm">
        <div id="login_form" class="loginform">
            <a href="#" class="create_account" onClick="ppOpen('#register_panel', '280');">CREATE ACCOUNT</a>
            <input type="text" id="email" name="email" class="inputbox" placeholder="Email">
            <input type="password" id="password" name="password" class="inputbox" placeholder="Password">
            <button  id="loginsubmit" class="btn btn-red">LOG IN</button>
            <a href="#" class="login_facebook">login with facebook</a>
            <div id="ack"></div>
        </div>
    </form>
    <div class="links">
        <a href="#" onClick="ppOpen('#forgot_panel', '350');">FORGOT YOUR USERNAME?</a> / 
        <a href="#" onClick="ppOpen('#forgot_panel', '350');">FORGOT YOUR PASSWORD?</a>
    </div>
</div>

Jquery Onclick功能无法正常工作

3 个答案: