dojo1.0 中关于拖拽 dnd的问题!

manlibie 2008-01-02 11:13:23
我们公司要用dojo1.0的开源框架,这方面没有研究过的,需要我自己与研究,但是我发现不知道从何入手去看dojo1.0,那里面好乱啊,我的js功底也不错拉,为什么会这样呢?我想主要的原因是:我不懂dojo1.0的框架架构,不知道从何入手?

比方说\dojo-release-1.0.2\dojo\tests\dnd\test_dnd.html 这个个例子,我也看拉,能修改一些样式之类的东西,但是比较复杂的问题有两个我没有解决!

1:比方说现在那里面的dnd里面例子是上下拖动(拖到一个元素的上面或者下面)的,我想给他加成左右拖动(拖到一个元素的左面或者右面)的,都不知道在哪里加呢?这个我好像解决拉,能拖到左面右面,但是不是很稳定,有时候拖动的时候不起作用。
2:因为我是直接在上下拖动的效果上面修改的,所以在拖动过程中,那个蓝色的粗线条(指示控件所拖放的目的地)任然水平的,我想我现在都是左右拖动拉,所以应该把蓝色的粗线条改成是垂直的。但是一直不知道在哪里改呢?
3:怎么去读dojo1.0的框架开源代码啊?

我修改过的test_dnd.html文件内容如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Dojo DnD test</title>
<style type="text/css">
@import "../../resources/dojo.css";
@import "../../resources/dnd.css";
@import "dndDefault.css";
body {
padding: 1em;
background: #ededed;
}
.container {
BORDER-RIGHT: #669999 2px solid; PADDING-RIGHT: 5px; BORDER-TOP: #669999 2px solid; PADDING-LEFT: 5px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 3px; BORDER-LEFT: #669999 2px solid; WIDTH:150px;HEIGHT:300px;PADDING-TOP: 5px; BORDER-BOTTOM: #669999 2px solid
}
.containerRight{
BORDER-RIGHT: #669999 2px solid; PADDING-RIGHT: 5px;HEIGHT:400px; BORDER-TOP: #669999 2px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 0px; MARGIN: 3px; BORDER-LEFT: #669999 2px solid; WIDTH:700px;HEIGHT:400px;PADDING-TOP: 5px; BORDER-BOTTOM: #669999 2px solid;height:200px;
}
.clear {
clear: both;
}
</style>
<script type="text/javascript" src="../../dojo.js" djConfig="isDebug: false, parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dojo.dnd.Source");
var total = 0;
function ClearMsg()
{
// dojo.byId("msg").innerHTML = "";
}
function init(){
dojo.subscribe("/dnd/start", function(source,nodes,iscopy){
});

dojo.subscribe("/dnd/drop/before", function(source, nodes, copy, target){
if(target == c2){
}
});
dojo.subscribe("/dnd/drop", function(source,nodes,iscopy){
var t = dojo.dnd.manager().target;
var noid= nodes[0].id;
var jsnode = source.getItem(nodes[0].id);
var x=c1.getAllNodes();
for(i =0;i<x.length;i++){
//jsNode is javascript object for node
//x[i] represents HTML element for the node
var jsnode = c2.getItem(x[i].id);
}
if(nodes){
var node=nodes[0];
if(node.parentNode.id=="left"){
var value=node.innerHTML;
node.innerHTML=value.substring(0,value.length-6);
var p=document.getElementById(""+noid);
p.style.styleFloat = 'none';
}else{
if(node.parentNode.id=="right"){
var value=node.innerHTML;
// alert(value.substring(value.length-6,value.length));
if(value.substring(value.length-5,value.length)=="value"){

}else{
node.innerHTML=value+" value";
}
var p=document.getElementById(""+noid);
p.style.styleFloat = 'left';
}
}
}

dojo.connect(c2, "onDndDrop", function(source, nodes, copy, target){
if(target == c2){
//console.debug(copy ? "Copying from" : "Moving from", source);
}
});

ClearMsg();
});
dojo.subscribe("/dnd/cancel", function(){
ClearMsg();
});

}
dojo.addOnLoad(init);
</script>
</head>
<body>
<h1 class="testTitle">Dojo DnD test</h1>
<div id="dragLists">
<div style="float: left; margin: 5px;">
<h3>Source 2</h3>
<div dojoType="dojo.dnd.Source" jsId="c1" id="left" class="container">
<div class="dojoDndItem">Item <strong>X</strong></div>
<div class="dojoDndItem">Item <strong>Y</strong></div>
<div class="dojoDndItem">Item <strong>Z</strong></div>
<div class="dojoDndItem">Item <strong>Alpha</strong></div>
<div class="dojoDndItem">Item <strong>Beta</strong></div>
<div class="dojoDndItem">Item <strong>Gamma</strong></div>
<div class="dojoDndItem">Item <strong>Delta</strong></div>
</div>
</div>
<div style="float: left; margin: 5px;">
<h3>Source 3</h3>
<div dojoType="dojo.dnd.Source" jsId="c2" class="containerRight" id="right">
</div>
</div>
</div>
</body>
</html>

其中dojo1.0在官网上有下载,大家可以去下载下。

各位帮忙指点指点,谢谢拉!
...全文
327 13 打赏 收藏 转发到动态 举报
写回复
用AI写文章
13 条回复
切换为时间正序
请发表友善的回复…
发表回复
zhdi0 2008-04-07
  • 打赏
  • 举报
回复
我也在看DOJO1.1,用原来DOJO0.3加入自己写的JS模板怎么提示找不到呢?感觉比原来复杂好多了
manlibie 2008-01-23
  • 打赏
  • 举报
回复
分数随便给的,多少是个数,没有固定的。抱歉!
manlibie 2008-01-23
  • 打赏
  • 举报
回复
奶奶的,csdn给我发了结帖子通知,自己不结的话,过几天强行结贴,到时候分数清空。问题都没有明目呢!
manlibie 2008-01-18
  • 打赏
  • 举报
回复
呵呵,dojo里面的继承机制是很难的!
JK_10000 2008-01-17
  • 打赏
  • 举报
回复
JKDrag里有inline对象拖动的示例:
JKHtml\JKDrag\JKDrag.htm
http://download.csdn.net/source/276201
yizhilaoshu 2008-01-17
  • 打赏
  • 举报
回复
同情楼主.
我也在研究DOJO,也提了个问题,还没解决.我觉得要用dojo,还是要先理解它的继承机制.我到现在对extend的实现还未完全理解.这是我当时的问题.http://topic.csdn.net/u/20080115/09/ca762f70-1ed6-4d0b-b3c4-0802363bc991.html
dh20156 2008-01-17
  • 打赏
  • 举报
回复
原来是关于框架,没用过,没有发言权。
manlibie 2008-01-17
  • 打赏
  • 举报
回复
继续up,直到有人解决为止!
gzdiablo 2008-01-17
  • 打赏
  • 举报
回复
JK出品简单易用
zhushouqqq 2008-01-17
  • 打赏
  • 举报
回复
呵呵...帮你顶一个.
manlibie 2008-01-11
  • 打赏
  • 举报
回复
我的帖子这么长时间啦,也没有人来回答啊!高手快来啊,高手快来啊!
manlibie 2008-01-02
  • 打赏
  • 举报
回复
分数不够,我过几天有分拉再追加!直到问题解决为止!
DiligencyMan 2008-01-02
  • 打赏
  • 举报
回复
留个记号,有空再看!@

87,992

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧