Question

我目前正在使用jquery构建一个网页，我有可拖动的div。一切正常，除非我单击其中一个div以使用AJAX发送索引。页面重新加载我从MySQL获得的新数据，但事件“draggable”，“sortable”和“droppable”给出以下错误：

"Uncaught TypeError: Object #<Object> has no method 'draggable' "

除了那些事件之外，一切正常。

以下是我的代码的一些示例：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript" src="plugins/calendar/jquery.datepick.js"></script>
<script type="text/javascript" src="js/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="js/validationPrescriptionNewConsole.js"></script> 
<script type="text/javascript" src="plugins/calendar/jquery.datepick.js"></script>
<script type="text/javascript" src="js/jquery.ui.core.js"></script>
<script type="text/javascript" src="js/jquery.ui.widget.js"></script>
<script type="text/javascript" src="plugins/balloon/jquery.balloon.js"></script>

(...)

$('#padroes').children().each(
    function(index, elem) 
    {
         $(elem).click(function(){

        $.ajax
        ({ 
            url: '***same page***',
            data: {indice: index, dt_ini: datepick1.value, dt_fim: datepick2.value },
            type: 'POST',
            success: function(output) 
            {
                $("body").html(output);     
            }
        });
    });
}); 
(...)

$(".jogos").draggable(
{ 
    cursor: "move",
    opacity: 0.7,
    revert: true,
    revertDuration: 50  
})

提前致谢。

Answer 1

永远不要在每个处理程序中定义点击功能。此外，您永远不会停止默认点击事件。

$('#padroes').children().click(function(e){  //add the e
    e.preventDefault(); //stop default behavior
    //your ajax call

});

此外，您正在使用$('body').html(output)，然后覆盖正文中的所有现有数据，因此在页面加载时绑定到这些元素的任何处理程序将不再具有与之关联的任何方法。您需要在ajax success function

中重新定义它们

success: function(output){
    $("body").html(output);
    $(output).find('.jogos').draggable({
        cursor: "move",
        opacity: 0.7,
        revert: true,
        revertDuration: 50  
    })
}

这应解决它。

“使用AJAX </object>后，未捕获的TypeError：Object＃<object>没有方法'draggable'”

1 个答案: