元素删除时$.post不工作


$.post not working when element dropped

我在自学jQuery和PHP,遇到了一些问题。一旦在可丢弃的div上拖放一个元素,我就需要将元素id发布到我的php脚本中

  • 我已经删除了除了一个提醒框之外的所有内容,以检查某个项目是否已被丢弃,因此该项目被视为可丢弃
  • 我手动在div中输入了一些内容,以确保可以看到结果
  • 我已经将name替换为var name="test",以测试可变内容

javascript文件和php脚本位于同一目录中,文件名正确。javascript拖放脚本包含在可丢弃区域之后

<script type="text/javascript" src="js/drag-drop.js"></script>

我已经将php脚本的结果替换为纯文本,以查看问题是否可能是收到的变量,没有返回任何内容。因此,这篇文章似乎没有涉及php脚本。希望有人能提供一些建议!

下面是我的代码,HTML只是一个div.

$(document).ready(function() {
    $('#carousel-ul li').draggable({
        helper: 'clone',
        revert: true
    });
    $('#drop').droppable({ 
        hoverClass: 'drophover',
        accept: '#carousel-ul li',
        drop: function(){
            //alert("has been accepted and dropped");
            var name = ui.helper.attr('id').val();
            $.post('javascript.php', { name: name }, function(data){
                $('#drop-content').html(data);
            });
        }           
    });           
});
<?php
    //echo "id was posted";
    if(isset($_POST['name'])){
        $name =  $_POST['name'];
        var_dump($name);
        echo name;
        //echo "id was posted inside";
    }
?>

Droppable小部件的API文档指出ui参数是jQuery对象,因此您应该尝试以下操作:

$('#drop').droppable({ 
    hoverClass: 'drophover',
    accept: '#carousel-ul li',
    drop: function(event, ui) {
        var name = $(ui.helper).attr('id');
        var content = $(ui.helper).html();
        $.post('javascript.php', { name: name, content: content }, function(data) {
            $('#drop-content').html(data);
        });
    }
});