当前位置 : 主页 > 网页制作 > Dojo >

dojo -- it is critical to pull in "dojo/domReady!"

来源:互联网 收集:自由互联 发布时间:2021-06-15
Issue: Can not get handler of an element by using dojo.byId(“element id”) ; You want to add an event to a button, code goes like this: scriptrequire(["dojo","dojo/on","dijit/registry","dojo/dom", "dojox/mobile", "dojox/mobile/parser", "

Issue:  Can not get handler of an element by using dojo.byId(“element id”) ;

You want to add an event to a button, code goes like this:

<script>

require(["dojo","dojo/on","dijit/registry","dojo/dom",

  "dojox/mobile",

  "dojox/mobile/parser",

  "dojox/mobile/SwapView",

  "dojox/mobile/PageIndicator",

  "dojox/mobile/Heading","dojox/mobile/ScrollableView",

  "dojox/mobile/EdgeToEdgeList","dojox/mobile/Button”

],function(dojo,on,registry,dom){

     var handler = dojo.byId("btn");

     on(handler, "click", function(e){

           alert("i am clicked");

     });

});

</script>

     <script type="text/javascript" src="engmain.js"></script>

 

</head>

<body style="visibility:hidden">

     <div id="mainview" class="mainview" data-dojo-type="dojox/mobile/ScrollableView">

    

     <button id="btn" data-dojo-type="dojox/mobile/Button">click me

           <img src="images/bottomarrow.png"/>

     </button>

     <div id="result" ></div>

                maincontent

     </div>

</body>

No matter how hard you clicked the button, the button just did not give you any response.

And you will see this in your debugging environment (FireBug) – target is null

 

Possible Cause:

DOM tree didn't ready when dojo.byId(“elementID” executed, so the element you specified cannot be identified.

Reference: http://www.jetwu.cn/archives/101 

 

Solution:

Ensure that you pull in dojo/domReady! when you need to do something with element of the DOM tree.


The code is as below, for your reference.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>

	<title>slip view</title>
	<link rel="stylesheet" href="">
	<script type="text/javascript" src="dojox/mobile/deviceTheme.js"></script>

	<script type="text/javascript" src="dojo/dojo.js" 
    	data-dojo-config="isDebug:false, parseOnLoad: true, debugAtAllCosts:false"></script>

<script>
require(["dojo","dojo/on","dijit/registry","dojo/dom",
	
  "dojox/mobile",
  "dojox/mobile/parser",
  "dojox/mobile/SwapView",
  "dojox/mobile/PageIndicator",
  "dojox/mobile/Heading","dojox/mobile/ScrollableView",
  "dojox/mobile/EdgeToEdgeList","dojox/mobile/Button","dojo/domReady!"
],function(dojo,on,registry,dom){
	var handler = dojo.byId("btn");	
	on(handler, "click", function(e){
		alert("i am clicked");
	});
});

</script>
	<script type="text/javascript" src="engmain.js"></script>

</head>
<body style="visibility:hidden">
	<div id="mainview" class="mainview" data-dojo-type="dojox/mobile/ScrollableView">
	
		<button id="btn" data-dojo-type="dojox/mobile/Button">click me
		<img src="images/bottomarrow.png"/>
		</button>
	<div id="result" ></div>
			main content
	</div>
</body>


</html>
网友评论