Question

这是我的原始代码：

<tr class="song" id="'.$this->i.'">
   <td class="clickable" id="td1_'.$this->i.'">
   ...
   </td>
</tr>

jQuery for that：

$(".clickable").click(function() 
{
//
    //Make only certain parts of songs clickable
    //Hacky Way to Get Index
    var temp = $(this).attr("id");
    temp = temp.split('_');
    var i = temp[1];
    var status = $('#status_'+i).val();

    alert('Clicked ' + i);

    var maxid = $('#maxid').val();
    if(status == "max") //if maximized
    {
        alert("max");
    }
    else
    {
        var user = $("#user_min"+i).val();
        var ytcode = $("#ytcode_min"+i).val(); 
        var title = $("#title_min"+i).val(); 
        var artist = $("#artist_min"+i).val(); 
        var genre = $("#genre_min"+i).val(); 
        var score = $("#score_min"+i).val(); 
        var ups = $("#ups_min"+i).val(); 
        var downs = $("#downs_min"+i).val();
        var id = $("#id_min"+i).val(); 
        var upload_date = $("#upload_date_min+i").val(); 

        //Maximizing New Song
        dataString = 'user='+ user + '&ytcode=' + ytcode +
                         '&title=' + title + '&artist=' + artist + 
                         '&genre=' + genre + '&score=' + score + 
                         '&ups=' + ups + '&downs=' + downs + 
                         '&id=' + id + '&upload_date=' + upload_date + 
                         '&i=' + i;

        $.ajax({
            type: "POST",
            url: "maxSongAjax.php",
            data: dataString,
            cache: false,
            success: function(html){
            $('#'+i).fadeIn(1000).html(html);
            }
        });

        //Setting Max ID to New Song
        $('#maxid').val(i);
    }

    return false;
});

我让ajax将相同的html返回到为测试目的替换的内容。但是，在我单击加载的html后，它不响应点击。警报中不会显示任何弹出窗口。

这是为什么？为什么加载的html没有像第一个那样响应？

Answer 1

对于刚接触jQuery的人来说，这是一个非常常见的问题;你必须使用.live()

.click（）仅绑定到现有元素。

.live（）的替代方法是.delegate（）

jQuery - 加载的HTML不响应点击

1 个答案: