1

我该怎么做才能使第二个按钮起作用？第一个按钮运行顺利，但第二个不是，如果你点击 test_link 它会显示第二个按钮，它是由 javascript 创建的

<script src="http://localhost/googledrive/www/ci/2.1.3/social/assets/jquery/jquery-1.7.1.js"></script>  
    <script type="text/javascript" >
    $(document).ready(function()
    {   
        $(".comment_button").click(function(){
            $.ajax({
                type: "POST",
                dataType : "json",
                url: "http://localhost/googledrive/www/ci/2.1.3/social/index.php/talk/test",
                data: { name: "John", time: "2pm" },
                success : function(cont) {
                    if(cont){
                        $.each(cont, function(key, val) {
                            alert(key+" "+val);
                        });
                        }
                     }              
            }); 
            return false;               
        });

        $(".comment_link").click(function(e){
        e.preventDefault(); 
        var element = $(this);
        var id = element.attr("post_id");
        $("#"+id).html('<input><button class="comment_button">Second button, not work</button>');  
        return false;
        });         
    });
    </script>



        <form method="post" action="http://localhost/googledrive/www/ci/2.1.3/social/index.php/talk/test/2">
        <button class="comment_button">first button, this_button works</button>
        </form>
        <div id="7"></div>
        <a href="http://localhost/googledrive/www/ci/2.1.3/social/index.php/talk/test/2" class="comment_link" post_id="7">test_link</a>
        <br>
        php code : <?php echo json_encode($_POST);?>
4

1 回答 1

0

您在.click()将按钮添加到 DOM 之前设置方法，您可以重新定义 JavaScript，例如：

$(document).ready(function () {
    $(".comment_link").click(function (e) {
        e.preventDefault();
        var element = $(this);
        var id = element.attr("post_id");
        $("#" + id).html('<input><button class="comment_button">Second button, not work</button>')
        .children(".comment_button").click(function () {
            $.ajax({
                type: "POST",
                dataType: "json",
                url: "http://localhost/googledrive/www/ci/2.1.3/social/index.php/talk/test",
                data: {
                    name: "John",
                    time: "2pm"
                },
                success: function (cont) {
                    if (cont) {
                        $.each(cont, function (key, val) {
                            alert(key + " " + val);
                        });
                    }
                }
            });
            return false;
        });
        return false;
    });
});

添加按钮后链接方法.click()，并在父级上查找。或者：

$(document).ready(function () {
    $(".comment_link").click(function (e) {
        e.preventDefault();
        var element = $(this);
        var id = element.attr("post_id");
        $("#" + id).html('<input><button class="comment_button">Second button, not work</button>')
            .children(".comment_button").click(commentButtonClicked);
        return false;
    });

    function commentButtonClicked() {
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "http://localhost/googledrive/www/ci/2.1.3/social/index.php/talk/test",
            data: {
                name: "John",
                time: "2pm"
            },
            success: function (cont) {
                if (cont) {
                    $.each(cont, function (key, val) {
                        alert(key + " " + val);
                    });
                }
            }
        });
        return false;
    }
});

将您的 ajax 调用移动到一个单独的非匿名函数并从.click()事件链中调用它，就像在前面的示例中一样......

于 2013-06-19T16:36:15.867 回答