I am trying to develop some drag and drop functionality. First, I just want the thing to drag. I m reading a book "Getting Started with Dojo, Kyle Hayes", but am having no luck.
我的一些问题:
- When I connect to the newest dojo and Google s library, nothing works at all.
- Whenever I include
djConfig="parseOnLoadin my initial script calling an older library from Google, nothing works. If I take out thedjConfig="parseOnLoad, then the page begins to work. - If I include
dojo.require("dojo.dnd.Target"), I lose all functionality. - and no matter what I do, I cannot get a simple div to drag.
I have included my code below, and sincerely appreciate any help anyone can give me in getting started.
<!DOCTYPE HTML>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js" djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
//dojo.require("dojo.parser");
dojo.require("dojo.dnd.move");
dojo.require("dojo.dnd.Source");
//dojo.require("dojo.dnd.Target");
dojo.require("dijit.form.Button");
dojo.require("dijit.form.TextBox");
document.write("I got this far");
var init = function()
{
dojo.connect(
dojo.byId( btnSayHello ),
"onclick",
this,
helloButton_onClick
);
}
var helloButton_onClick = function(event)
{
alert ( Hello World and hello + dojo.byId( txtName ).value + ! );
}
dojo.addOnLoad(init);
</script>
</head>
<body>
<div id="dragMe" dojoType="dojo.dnd.move" style="border: 1 solid black; height: 300; width: 300;">
Source 1
</div>
<div id=Div1 dojoType="dojo.dnd.Target" style="border: 1 solid black; height: 300; width: 300;">
Target
</div>
<div>
<h1>Hello World Example</h1>
<hr/>
<label for="txtName">Your name:</label>
<input id="txtName" type="text" dojoType="dijit.form.TextBox"/><br/>
<button id="btnSayHello" dojoType="dijit.form.Button">Say Hello</button>
</body>
</html>