在.remove()和.append()之后返回我的事件按钮

时间:2015-10-14 08:31:45

标签: javascript jquery

我在复选框按钮上有一个点击事件,我在点击事件中将其删除,然后再次使用其他值附加它。我的问题是新的附加后点击事件不再起作用。

<input class="year" type="checkbox" value="2015" /> 2015 <br>
$(".year").click(function(){
    $(".col-md-12").remove(); //i remove the div which contains the checkbox 

    $.ajax({
        url: "criteria_search",          
        type: 'POST', 
        data: {
            criteria: "authors", 
            value: "test" 
        },
        success: function(data) { 
            articles = $.parseJSON(data)
            $("#AppendToElem").append(" <div class=\"col-md-12\"> <h2> Search Results <\/h2> <p> <span>There are<\/span> <strong>3974<\/strong> <span>results for:<\/span> <strong>Computer Animation and Virtual Worlds<\/strong> <\/p> <p> <a class=\"btn\" href=\"#\"><\/a> <\/p> <div class=\"row\"> <div class=\"col-md-3\"> <h3> Filter List <\/h3> <div class=\"form-group\"> <label for=\"exampleInputEmail1\"> Year <\/label><br>");   
            $.each(articles, function(index, jsonObject){
                $("#AppendToElem").append("<input class=\"year\" type=\"checkbox\" value=" + jsonObject.date.date.substring(0, 4) + " /> " + jsonObject.date.date.substring(0, 4) + "<br>") 
            });
        )
    });
});

在我第二次点击我的复选框后,没有处理点击事件。我该如何解决这个问题?

1 个答案:

答案 0 :(得分:1)

请改用on。即使您追加checkbox后它也应该有效:

$(document).on("click",".year",function(){

 $(".col-md-12").remove();//i remove the div which contains the checkbox 
 ..other code...

});