1、设计关键
（1）设置Button背景图片
（2）设计Button点击事件
2、设计步骤
（1）设置Button背景图片
A、样式设置
.btnIcon{
width:30px;
height:32px;
background:url("../images/search.png") center center no-repeat;
}
B、样式引入
data-dojo-props="iconClass:'btnIcon'"
（2） 设计Button点击事件
<script type="dojo/on" data-dojo-event="click" data-dojo-args="evt">
require(["dojo/dom"],function(dom){
dom.byId("content").innerHTML += "查询! ";
});
</script>
3、设计结果
（1）初始化时，运行如图所示：
（2）点击“查询”按钮后，出现
4、附录
源码：
<!DOCTYPE html>
<!--
To change this license header,choose License Headers in Project Properties.
To change this template file,choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<title>Button</title>
<Meta charset="UTF-8">
<Meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="../script/dojoroot/dijit/themes/tundra/tundra.css"/>
<script type="text/javascript" src="../script/dojoroot/dojo/dojo.js" data-dojo-config="isDebug: true,parSEOnLoad: true"></script>
<style type="text/css">
body{
width:80%;
height:100%;
font-size:12px;
text-align:center;
}
.btnIcon{
width:30px;
height:32px;
background:url("../images/search.png") center center no-repeat;
}
</style>
<script type="text/javascript">
</script>
</head>
<body class="tundra">
<button data-dojo-type="dijit/form/Button" id="myBtn" data-dojo-id="myBtn" data-dojo-props="iconClass:'btnIcon'" type="button">查询
<script type="dojo/on" data-dojo-event="click" data-dojo-args="evt">
require(["dojo/dom"],function(dom){
dom.byId("content").innerHTML += "查询! ";
});
</script>
</button>
<div id="content"></div>
</body>
</html>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
