每日学习总结:CSS:Clear属性的用法、重复交易提示框、弹出提示框后页面变形、asp.net调用smtp服务发送邮件问题

2013-5-11

1 .CSS:clear属性的用法

上周在项目中,在做对用户输入信息进行验证,如果有验证有错的话,需要显示提示信息,提示信息要显示在文本框的下边,有想过用<br/>换行,但是那样的话单元格就会变成两行,影响页面的布局,而提示信息又是动态的,如果验证通过则不显示,最后想要了用clear:both的方法来解决这样的问题.

主要代码如下:

<td  >
<asp:TextBox ID="Net_adds_5_yr" runat="server"></asp:TextBox>
 <div style="clear:both">
<asp:RegularExpressionValidator ID="RegularExpressionValidator7" runat="server"  Display="Dynamic"  ErrorMessage="输入的内容必须为数字"
ControlToValidate="Net_adds_5_yr"  ValidationExpression="^\d+$">
</asp:RegularExpressionValidator>
        </div>
</td>

  

代码中高亮的部分就是将一个验证控件放在div的内部,然后为Div添加clear:both的style这样就可以很好的起到了换行的效果,如下图所示:

图1-1 验证提示信息自动换行显示

下面就具体的了解一下CSS中的clear属性吧。

Clear属性是为了控制float属性在文档流的物理位置。

那float属性又是什么呢?

float 属性定义元素在哪个方向浮动。这个属性多应用于图像,使文本围绕在图像周围,在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。

如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄。

注释:假如在一行之上只有极少的空间可供浮动元素,那么这个元素会跳至下一行,这个过程会持续到某一行拥有足够的空间为止。

如下所示:

<div style="width:1000px;">
    <div id=’left’ style="background:green; width:100px;float:left;">I'm the left float</div>
    <div id=’right’ style="background:orange; width:100px; float:right;">I'm the right float</div>
    <div id=’nothing’ style="background:lightblue; width:300px">I don't know what happened</div>
    </div>

  

如果不清除浮动的话,id为nothing将会和id为left、right的div在同一行显示,如果想让它在下边一行显示就需要用到clear:both属性了。下面来看一下在未使用clear:both之前的效果和使用之后的效果:

图1-2 未使用clear:both属性时效果图

图1-3 使用clear:both属性之后的效果图

这样就不难理解添加了clear:both之后div会自动换行了吧。

下边我们再把id为nothing的div宽度变窄一些看看会有什么效果。

<div style="width:500px;">
    <div style="background:green; width:100px;float:left;">I'm the left float</div>
    <div style="background:orange; width:100px; float:right;">I'm the right float</div>
    <div style="background:lightblue; width:200px;">I don't know what happened</div>
    </div>

图1-4 id为nothing的div宽度变窄之后的效果图

为什么id为noting的div排在了最左边的呢,且有一部分和id为left的div重合了,那是因为只要有一个元素浮动,且浮动不清除时,下边其他的元素都会默认的左浮动。

如下所示:

<div style="width:600px;">
    <div style="background:green; width:160px;float:right;">I'm the left float</div>
    <div style="background:orange; width:90px; float:right;">I'm the right float</div>
    <div style="background:red; width:100px; float:right;"> Ok ,I'm by stander</div>
    <div style="background:lightblue; width:200px; ">I don't know what happened</div>
</div>
 

  

图1-5 前三个div均向右浮动第四个div不浮动效果图

然后我们再为id为nothing的div添加上clear:left属性看看有什么效果。

图1-6 id为nothing的div宽度变窄之后添加clear:left属性之后的效果图

在添加清除左浮动的属性时,id为nothing的div换到了下一行显示,类似换行的效果。

到这里为止已经向大家讲述了clear属性的三个属性值,即:left,right,both,还有一个值为none即允许两边都有浮动。

2. 若要再次显示该网页,Web浏览器需要重新发送您以前提交的信息解决办法

有时候在页面刷新的时候会出现如下图所示的情况:

图2-1 页面重复交易提示示意图

出现这样的情况的原因在于,你在父页面有过提交,即IsPostBack为true,当打开的子页面经过一些列的操作之后关闭,然需要再次刷新父页面,显示对子页面的操作效果。这个时候对页面进行刷新时相当于将原来的值再次向服务器提交,处于安全的考虑,浏览器会给出如上的提示。

下面给出一个出现这样的情况的场景:

首先有一个List页,并且有查询,当你输入一些查询筛选条件,然后点击查询,出现了你想要的那些结果,然后点击其中的一项进行编辑,这时会弹出一个编辑页,待编辑完成之后,关闭弹出的编辑页,同时刷新父页面,显示编辑改变的效果。如果只是单纯的页面刷新则会出现上边的提示框,那么该如果避免以上的情况出现呢?

大多数朋友会采取在Edit页的提交按钮中写下这样的代码:

Response.Write("<script language='javascript'>window.opener.location.href = window.opener.location.href;window.close();</script>");

即关闭edit页,同时导向父页面,但是这个时候另一个问题就出来的,你之前的查询条件都被清空了,也就是说你的List列表重新被绑定了,查询条件也没有了,这样你就没有办法马上看到你刚刚的一些编辑效果。

所以最好的解决办法就是,当子页面关闭之后,在父页面中再次的调用查询按钮的click事件,即相当于再次查询,这样就避免的页面的重复交易的提示。

图2-2 模拟的List页面示意图

在上边的页面中输入查询过滤的内容,查询出符合的条件,然后选择其中一项编辑,编辑之后,再调用查询按钮的click事件,在前台页面可以这样写:

document.getElementById("btnSearch").click();

这句代码应该是在页面的回调函数中执行的,根据各自的情况进行添加吧。

3. asp.net 显示消息提示框之后页面变乱

这种提示框出现的情形往往是在,用户登录验证失败之后、以及新增、编辑信息失败之后给用户的错误提示信息。

往往在后台会这样写:

Response.Write("<script language='javascript'>alert('新增信息失败!')</script>");

因为这样写的话页面的输出流就要发生变化在页面文档最前面写上<script>字符串,这样会使文档的声明失效,因为文档声明之前是不能有其他字符的。

只需将以上的代码改为如下代码即可,即在后台采用脚本注册的方式解决此问题。

ClientScript.RegisterStartupScript(this.GetType(),"alert","<script language='javascript'>alert('新增信息失败!');</script>",true);

4. asp.net 调用smtp服务发送邮件问题

上周项目开发中有遇到需要调用smtp服务发送邮件的需求。本来这是一个很简单的一个开发任务,但在实际开发中却遇到了很多很多的问题。下面就和大家分享一下其中遇到的问题。

先向大家展示一下一段邮件发送的测试代码:

 SmtpClient client = new SmtpClient("公司的邮件服务");
            client.Credentials = new NetworkCredential("用户", "密码"); //设置发件人的验证凭据

            client.UseDefaultCredentials = true;
            client.DeliveryMethod = SmtpDeliveryMethod.Network; //通过网络将电子邮件发送到smtp服务器
            client.EnableSsl = true; //使用安全套接字层加密连接
            MailMessage mess = new MailMessage();
            mess.From = new MailAddress("发件人邮箱", "发件人");
            mess.To.Add(new MailAddress("收件人邮箱", "收件人"));
            mess.Priority = MailPriority.High; //设置邮件优先级
            mess.BodyEncoding = Encoding.UTF8;
            mess.SubjectEncoding = Encoding.UTF8;
            mess.IsBodyHtml = true; //设置内文内容是否为html格式
            mess.Subject = "主体";
            mess.Body = "正文";
            client.Send(mess);

  

1) 邮箱不可用。服务器响应为:5.7.1 Unable to replay for xxx@qq.com

问题出现情况在于使用公司内部的邮件服务时,对公司内部员工发送邮件没有任何问题,

但是对其他邮箱的用户比如:qq、新浪、网易等邮箱发送邮件时会提示上边的错误。

解决方法是:将部署发送邮件程序的服务器IP 添加到 邮件服务器的中继列表中。

具体的操作为:在smtp虚拟服务器中进行设置,找到默认的SMTP服务点击右键à属性à访问à中继à选择可以通过该虚拟服务器进行中继的计算机à选择仅以下列表à然后点击添加à添加你要支持发送 右键的服务器的ip即可(例如本地iP:127.0.0.1也可以是其他ip)

2) smtpClient发邮件错误:不允许使用邮箱名称。 服务器响应为: You are not authorized to send mail, authentication is required

出现这样的原因可能在于有些邮箱不支持调用其服务发送邮件,比如网易的最新申请的邮箱均不支持,所以大家在测试的时候最好就不要用网易的邮件服务了,那样只会浪费更多的时间。

另一个原因是有些邮件服务的验证用户名,需要为XXX@sina.com的格式,而有些邮箱比如网易的邮箱验证用户名则只需输入用户名不需要@163.com的部分

3) SMTP 服务器要求安全连接或客户端未通过身份验证。 服务器响应为: Authentication required

出现这样的错误在于邮件服务连接为非安全连接,解决方法是:首先确保服务器支持安全连接,然后将服务器连接设置为安全连接,即:添加如下代码:

client.EnableSsl = true;即可

4) 服务器不支持安全连接

解决办法:将服务器开启安全连接服务,或者client.EnableSsl = false;即可。

今天就总结到这里,希望可以给大家带来些启发和帮助。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值