我正在尝试使用 dojo 对话框小部件创建一个显示文本和图像的对话框，每当我通过 innerhtml 传递图像详细信息时，文本或图像都不会出现弹出窗口。
它对文本细节工作正常，但不显示图像细节。我在下面包含了我的代码:
HTML:
<div data-dojo-type="dijit.Dialog" title="SUB Details"
style="width: 500px; height: 150px; display:none;
id="subDetailDialog"
data-dojo-id="kycDetailDialog">
<br>
<table border ='0px' align='center' width='400' class='detailedInfo' id='detailedInfo' >
<tr class='even'>
<td style="width:40%"><strong>First Name</strong></td><td><strong>:</strong></td>
<td id='firstNameRow' style="width:40%"></td>
</tr>
<tr class='odd'>
<td><strong>Date of birth</strong></td><td><strong>:</strong></td>
<td id='dobRow'></td>
</tr>
<tr class='even'>
<td><strong>Subscriber Image</strong></td><td><strong>:</strong></td>
<td id='imgRow'></td>
</tr>
</table>
</div>
Javascript:
dojo.byId("firstNameRow").innerHTML = data.firstName;
dojo.byId("dobRow").innerHTML = data.dob;
dojo.byId("imgRow").innerHTML = '<img src="/images/123456789_.jpg" border="0" width="32" height="32"/>';
subDetailDialog.show();
最佳答案
我不知道你哪里弄错了，一定要检查图像是否加载成功(在控制台)，
另一点是您必须调用 data-dojo-id 标识符来显示对话框 kycDetailDialog 而不是 subDetailDialog 。
下面是一个可能对您有帮助的工作片段(使用现代 dojo AMD)
require(["dijit/Dialog", "dojo/dom","dojo/on","dijit/form/Button","dojo/ready","dojo/parser"],
function(Dialog,Dom,On,Button,ready,parser){
parser.parse();
ready(function(){
On(Dom.byId("btn"),"click",function(e){
kycDetailDialog.show();
});
//data you grab from ajax or other stuff ...
var data = {
firstName:"bRIMOs",
dob:"21/01/1989"
}
Dom.byId("firstNameRow").innerHTML = data.firstName;
Dom.byId("dobRow").innerHTML = data.dob;
Dom.byId("imgRow").innerHTML = '<img src="https://www.codeproject.com/KB/GDI-plus/ImageProcessing2/flip.jpg" border="0" width="32" height="32"/>'
kycDetailDialog.show();
});
}
);<script src="//ajax.googleapis.com/ajax/libs/dojo/1.11.3/dojo/dojo.js"></script>
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dijit/themes/claro/claro.css" rel="stylesheet"/>
<body class="claro">
<div data-dojo-type="dijit/form/Button" id="btn">Show subscriber info </div>
<div data-dojo-type="dijit/Dialog" title="SUB Details" style="width: 500px; height: 150px; display:none;" id="subDetailDialog" data-dojo-id="kycDetailDialog"><br>
<table border='0px' align='center' width='400' class='detailedInfo' id='detailedInfo'>
<tr class='even'>
<td style="width:40%"><strong>First Name</strong></td>
<td><strong>:</strong></td>
<td id='firstNameRow' style="width:40%"></td>
</tr>
<tr class='odd'>
<td><strong>Date of birth</strong></td>
<td><strong>:</strong></td>
<td id='dobRow'></td>
</tr>
<tr class='even'>
<td><strong>Subscriber Image</strong></td>
<td><strong>:</strong></td>
<td id='imgRow'></td>
</tr>
</table>
</div>
</body>如果你想测试代码，这里有一个 fiddle -> FIDDLE
关于javascript - 弹出图像和文本的 Dojo 对话框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42771016/