在asp.net中动态生成HTML元素时缺少图像源 [英] Image source missing while generating HTML elements dynamically in asp.net

问题描述

我在DataTable dt5中有4行。我试图动态生成某些html元素动态等于dt5中的行数。

Visual studio代码：

 <％  for （ int  i =  0 ; i <  dt5.Rows.Count; i ++）
 {
 ％>  
 <   div     id   =  Div1      class   =  image_stack    style   =  margin-left：600px    runat   =  server   >  
 <   img       class   =  stackphotos photo1    src   = 〜/ Images / 3.jpg    clientidmode   =  static    runat   = < span class =code-keyword> server    /  >  
 <   img       class   =   stackphotos photo2    src   = 〜/ Images / 4.jpg    clientidmode   =  static < span class =code-attribute>   runat   =  server  /  >  
 <   img         class   =  stackphotos photo3    src  < span class =code-keyword> = 〜/ Images / 5.jpg    clientidmode   =  static    runat   = 服务器  /  >  
 <   / div  >  
 <   br     /  >  <   br     /  >  <   br    < span class =code-keyword> /  >  <   br     /   >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  < ;   br     /  < span class =code-keyword>>  <   br     /  >  <   br     /  >  <   br     /  >  
 <％} ％>  

我能够生成html但问题所需的html即（在mozilla中查看源代码）应该是....

第一次迭代代码：

 <   div     id   =  ContentPlaceHolder1_Div1    class   =  image_stack     style   =  margin-left：600px >  
  <   img     src   =  Images / 3.jpg    class   =  stackphotos photo1    /  >  
 <   img     src   =  Images / 4.jpg    class  < span class =code-keyword> =  stackphotos photo2    /  >  
 <   img     src   =  Images / 5.jpg    class   =  stackphotos photo3    /  >  
 <   / div  >  
 <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  

但生成的代码是......

 <   div     id   =  ContentPlaceHolder1_Div1    CL ass   =  image_stack   样式  =  margin-left：600px >  
 <   img     class   =  stackphotos photo1    /  >  
 <   img     class   =  stackphotos photo2    /  >  
 <   img     class   =  stackphotos photo3    /  >  
 <   / div  > ;  
 <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >   <   br     /  >  <   br     /  >  <   br     /  >  <   br  < span class =code-attribute>   /  >  <  < br     /  >  <   br     /  >  

正如您所看到的，生成的代码中缺少''src''部分。是什么缺少src？

解决方案

试试这个....

 <％  for （ int  i =  0 ; i <  dt5.Rows.Count; i ++）
 {
 ％>  
 <   div     id   =  Div1      class   =  image_stack    style   =  margin-left：600px    runat   = 服务器   >  
 <   img       class   =  stackphotos photo1    src   = 〜/ Images / 3.jpg    clientidmode   = 静态    runat   =  server    /  >  
 <   img       class   =  stackphotos photo2     src   = < span class =code-keyword>〜/ Images / 4.jpg    clientidmode   = 静态    runat   =  server  /  >  
 <   img         class   =  stackphotos photo3    src   = 〜/ Images / 5.jpg    clientidmode   = 静态    runat   =  server  /  >  
 <   / div  >  
 <   pre  >  
 <％ Img1.Src =  〜/ Images / 3.jpg; 
 Img2.Src =  〜/ Images / 4.jpg; 
 Img3.Src =  〜/ Images / 5.jpg; ％>  
 
 <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  > ;  <   br    < span class =code-keyword> /  >  <   br     /   >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  <   br     /  >  
 <％} ％> < /跨度> 

I have 4 rows in DataTable dt5. I am trying to generate certain html elements dynamically equal to number of times as the rows in dt5.
Visual studio code:

<% for(int i = 0; i < dt5.Rows.Count; i++)
{
%>
<div id="Div1"  class="image_stack" style="margin-left:600px" runat="server" >
<img  class="stackphotos photo1" src="~/Images/3.jpg" clientidmode="static" runat="server" />
<img  class="stackphotos photo2" src="~/Images/4.jpg" clientidmode="static" runat="server"/>
<img   class="stackphotos photo3" src="~/Images/5.jpg" clientidmode="static" runat="server"/>
</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<% } %>

I am able to generate the html but the problem the desired html i.e (view source in mozilla) should be....
First Iteration code:

<div id="ContentPlaceHolder1_Div1" class="image_stack" style="margin-left:600px">
<img src="Images/3.jpg" class="stackphotos photo1" />
<img src="Images/4.jpg" class="stackphotos photo2" />
<img src="Images/5.jpg" class="stackphotos photo3" />
</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />

But the code getting generated is is ...

<div id="ContentPlaceHolder1_Div1" class="image_stack" style="margin-left:600px">
<img class="stackphotos photo1" />
<img class="stackphotos photo2" />
<img class="stackphotos photo3" />
</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><<br /><br />

As you can see the ''src'' part is missing in the code generated . WHy is src missing?

解决方案

try this....

<% for(int i = 0; i < dt5.Rows.Count; i++)
{
%>
<div id="Div1"  class="image_stack" style="margin-left:600px" runat="server" >
<img  class="stackphotos photo1" src="~/Images/3.jpg" clientidmode="static" runat="server" />
<img  class="stackphotos photo2" src="~/Images/4.jpg" clientidmode="static" runat="server"/>
<img   class="stackphotos photo3" src="~/Images/5.jpg" clientidmode="static" runat="server"/>
</div>
<pre>
<% Img1.Src="~/Images/3.jpg";
Img2.Src="~/Images/4.jpg";
Img3.Src="~/Images/5.jpg"; %>

<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<% } %>

这篇关于在asp.net中动态生成HTML元素时缺少图像源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！