Jquery on drop 删除助手

Question

我使用 jquerydraggable 和 jquerydroppable ，在draggable函数中我使用辅助克隆，当我放置拖动的元素时，它应该删除克隆并显示另一个div，在可放置的地方我有一个div，里面是不可见的并且在放下它应该是可见的，这是我的代码

$('#external-events .fc-event').each(function() {
                        // store data so the calendar knows to render an event upon drop

                        // make the event draggable using jQuery UI
                        $(this).draggable({
                            helper:'clone',
                            zIndex: 999999,
                            containment: 'window',
                            appendTo:'body',
                            scroll: false,
                            revert: true,      // will cause the event to go back to its
                            revertDuration: 0,  //  original position after the drag
                            // start: function(){
                            //     $(this).fadeOut();
                            //
                            // },
                            // stop: function(){
                            //     $(this).fadeIn();
                            // }
                        });

                    });

这是我的可删除函数

 $(to).droppable({

                drop: function ( event, ui ){
                 $("ui.draggable").clone().hide();
                    var avatar = '';
                    var user = ui.helper[0].id;
                    console.log("user", user);
                    var fullname = $('#'+user+' .fullName').text();
                    var hiddenInput = $('#'+user+' .userId').val();
                    console.log("ID: ", hiddenInput);
                    console.log(fullname);
                    $('#uname_here').text(fullname);
                    var userId = '#' + ui.helper[0].id + ' .userId';
                    $('.whenDropOwnerHideThis').hide();
                    $("div#dropedUser").show();
                    $('#dropUserForHeadOfProjectInput').val(hiddenInput);
                    $("#dropUserForHeadOfProject").removeClass('error_empty');
                    $("#drop_head_project").removeClass('error_empty');

                }
            });

像这样它不起作用，它显示错误

Uncaught Error: Syntax error, unrecognized expression: # .fullName

Answer 1

我想你想通过 id 获取元素这是id就像 user.fullname并且您在下面的代码中犯了一个错误:

var fullname = $('#'+user+' .fullName').text();

要使用任何元字符(例如 !"#$%&'()*+,./:;<=>?@[\]^``{|}~ )作为名称的文字部分，必须使用两个反斜杠 \\ 将其转义。 。例如，具有 id="foo.bar" 的元素，可以使用选择器$("#foo\\.bar") 。 (More information)

所以你需要像这样更改代码:

var fullname = $('#'+user+'\\.fullName').text();