jQuery .attr() undefined 仅在 Chrome 中

Question

我正在为工作制作一个 HTML5 技术演示，其中用户可以将“应用程序”从菜单拖到屏幕上，它们将出现在页面上可移动和可调整大小的 iframe 中。这一切在 Firefox 中运行良好，但当我在 Chrome 中尝试时(它支持更多 HTML5 功能)，它会尝试在我所在的任何目录中加载“未定义”的 url。这是我的代码。

$(".menu-app")
                .attr("draggable", "true")
                .bind("dragstart", function(ev) {
                    var dt = ev.originalEvent.dataTransfer;
                    var src = $(this).attr("value");
                    dt.setData("src", src);
                    return true;
                    })
                .bind("dragend", function() {
                    return false;
                    });
            $("#content")
                .bind("dragenter", function() {
                    return false;
                    })
                .bind("dragleave", function() {
                    return false;
                    })
                .bind("dragover", function() {
                    return false;
                    })
                .bind("drop", function(ev) {
                        var dt = ev.originalEvent.dataTransfer;
                        $("#content").html($("#content").html()+
                            "<div class='app'><iframe width='100%' height='100%' frameborder='0' src='"+
                                dt.getData("src")+"'></iframe></div>");
           // Make application windows draggable and resizable 
           $(".app").resizable({grid:20}).draggable({grid:[20,20]}).addClass("ui-widget-content");
                    return false;
                    });

Answer 1

原来问题根本不在 jQuery 中。这是因为 chrome 仅支持 2 种拖放数据类型:“Url”和“Text”。将 dt.setData("src", src); 切换为 dt.setData("Text", src); 解决了问题。