Question

我有一个名为＆＃34; LOGIN＆＃34; (id="log")和一个名为＆＃34; Connect＆＃34;的子菜单(id="connect")。如果我点击连接，则会显示一个表格。现在，当用户登录成功时，我想更改名称菜单＆＃34; LOGIN＆＃34;用户名和＆＃34; Connect＆＃34;对于＆＃34;收件箱＆＃34;，这有效，但我需要更改ID和删除事件监听器$('#connect').click(function(e) {}，因为用户已连接，我需要在＆＃34;收件箱＆＃34;喜欢

$('#inbox').click(function(e) { alert("You click on inbox");    });

的Javascript

 $(document).ready(function() {


                function Login() {


                    this.loadForm = function() {

                        $("#response-container").load("formLogin.php", function() {

                            $("#formLogin").submit(function(event) {

                                var user = $("#username").val();
                                var pass = $("#password").val();

                                event.preventDefault();

                                searchData(user, pass);

                            });

                        });

                    }; //END loadForm FUNCTION




                    var searchData = function(user, pass) {

                        getdetails(user, pass)

                        .done(function(response) {

                            if (response.success) {

                                $.each(response.data.users, function(key, value) {

                                    $("#log").text(value['userName']);

                                    $("#connect").text('inbox');


                                    //HERE I WANT TO REMOVE CLICK EVENT FROM #conect and i want to
                                    //change his 'id' for a new id called 'inbox' and add a new
                                    //click event listener                                   

                                });
                            } else {

                                alert("Fail");

                            }
                        })

                        .fail(function(jqXHR, textStatus, errorThrown) {


                        });


                    }; //END FUNCTION searchData




                    var getdetails = function(id, password) {

                            return $.getJSON("20.php", {
                                "id": id,
                                "password": password
                            });

                        } //END FUNCTION getdetails




                }; //END LOGIN CLASS



                //LISTENERS

                $('#connect').click(function(e) {

                    e.preventDefault();

                    var login = new Login();

                    login.loadForm();

                });




            });

HTML

<!DOCTYPE html>
<html lang="es-ES"><html>
    <head>
         <meta charset="utf-8">
          <link rel="stylesheet" type="text/css" href="21-12-16.css">
        <script src="//code.jquery.com/jquery-latest.js"></script>


  <script src="20.js"></script>


        <title>Menu</title>

    </head>
    <body>

        <div id="header">
            <ul class="nav">
                <li><a href="">Home</a></li>
                <li><a href="" id="log">LOGIN</a>
                    <ul>
                        <li><a href="" id="connect">Conect</a>

                        </li>
                    </ul>
                </li>


            </ul>
        </div>
     <div id="response-container"></div>
    </body>
</html>

Answer 1

unbind和bind已弃用。您应该使用off进行解除绑定，使用on进行绑定。

Answer 2

您可以在jquery对象上使用unbind来删除事件，使用函数attr来更改id

$('#connect').unbind('click').click(//function click here)
$('#connect').attr('id','inbox');

Refence attr，unbind

Answer 3

$("#connect").unbind();删除所有活动

$("#connect").attr('id','inbox');更改ID

$("#inbox").click(function (){

//click event

})

您的代码现在看起来像：

$.each(response.data.users, function(key, value) {

$("#log").text(value['userName']);

$("#connect").text('inbox');

$("#connect").unbind();


$("#connect").attr('id','inbox');

    $("#inbox").click(function (){

    //click event

    })

 });

使用jquery更改id并删除click事件

3 个答案: