我之前从“Rendering a view to a string in MVC, then redirecting -- workarounds?”抓取了一些代码,现在下面是我用来将一个页面的html显示为电子邮件正文内容的代码,并使用“javascript:document.print; ”
问题在于我有一些基于他们的类转换成数字图像的Span。所以<div class="price black"><span class="dollar">$</span><span class="one"></span><span class="five"></span></div>
。
span类1显示为数字1的图像,因此只有一个。
问题在于它们在页面的javascript打印或电子邮件正文中都不起作用。
你能告诉我为什么吗?
以下是mvs和css的代码。
public virtual string RenderViewToString(ControllerContext controllerContext, string viewPath, string masterPath, ViewDataDictionary viewData, TempDataDictionary tempData, object Model)
{
if (tempData == null)
{
tempData = new TempDataDictionary();
}
Stream filter = null;
ViewPage viewPage = new ViewPage();
//Right, create our view
viewPage.ViewContext = new ViewContext(controllerContext, new WebFormView(viewPath, masterPath), viewData, tempData);
//Get the response context, flush it and get the response filter.
var response = viewPage.ViewContext.HttpContext.Response;
response.Flush();
var oldFilter = response.Filter;
try
{
//Put a new filter into the response
filter = new MemoryStream();
response.Filter = filter;
//Now render the view into the memorystream and flush the response
viewPage.ViewContext.ViewData.Model = Model;
viewPage.ViewContext.View.Render(viewPage.ViewContext, viewPage.ViewContext.HttpContext.Response.Output);
response.Flush();
//Now read the rendered view.
filter.Position = 0;
var reader = new StreamReader(filter, response.ContentEncoding);
return reader.ReadToEnd();
}
finally
{ //Clean up.
if (filter != null)
{
filter.Dispose();
}
//Now replace the response filter
response.Filter = oldFilter;
}
}
的CSS:
.price-a {}
.price-a span {}
.price-b {padding: 0 0 0 20px; background: url(../images/icon-price-b.gif) 0 0 no-repeat; color: #00a3a1;}/*cleared*/
.price-b span {display: block; height: 42px; padding-right: 2px; float: left; background: url(../images/numbering-b.gif) 0 0 no-repeat; text-indent: -9999em;}
.price-b span.one {width: 19px; background-position: 0 0;}
.price-b span.two {width: 31px; background-position: 0 -42px;}
.price-b span.three {width: 32px; background-position: 0 -84px;}
.price-b span.four {width: 36px; background-position: 0 -126px;}
.price-b span.five {width: 32px; background-position: 0 -168px;}
.price-b span.six {width: 35px; background-position: 0 -210px;}
.price-b span.seven {width: 32px; background-position: 0 -252px;}
.price-b span.eight {width: 34px; background-position: 0 -294px;}
.price-b span.nine {width: 34px; background-position: 0 -336px;}
.price-b span.zero {width: 36px; background-position: 0 -378px;}
.price-c {padding: 0 0 0 20px; background: url(../images/icon-price-c.gif) 0 0 no-repeat; color: #ad0974;}/*cleared*/
.price-c span {display: block; float: left; padding-right: 2px; background: url(../images/numbering-c.gif) 0 0 no-repeat; text-indent: -9999em; height: 42px; width: 35px;}
.price-c span.one {width: 19px; background-position: 0 0;}
.price-c span.two {width: 31px; background-position: 0 -42px;}
.price-c span.three {width: 32px; background-position: 0 -84px;}
.price-c span.four {width: 36px; background-position: 0 -126px;}
.price-c span.five {width: 32px; background-position: 0 -168px;}
.price-c span.six {width: 35px; background-position: 0 -210px;}
.price-c span.seven {width: 32px; background-position: 0 -252px;}
.price-c span.eight {width: 34px; background-position: 0 -294px;}
.price-c span.nine {width: 34px; background-position: 0 -336px;}
.price-c span.zero {width: 36px; background-position: 0 -378px;}
.price-c strong {padding: 24px 0 0 4px; display: block; float: left;}
.price-d {padding: 0 0 0 20px; background: url(../images/icon-price-d.gif) 0 0 no-repeat; color: #48104a;}/*cleared*/
.price-d span {display: block; float: left; padding-right: 2px; background: url(../images/numbering-d.gif) 0 0 no-repeat; text-indent: -9999em; height: 42px; width: 35px;}
.price-d span.one {width: 19px; background-position: 0 0;}
.price-d span.two {width: 31px; background-position: 0 -42px;}
.price-d span.three {width: 32px; background-position: 0 -84px;}
.price-d span.four {width: 36px; background-position: 0 -126px;}
.price-d span.five {width: 32px; background-position: 0 -168px;}
.price-d span.six {width: 35px; background-position: 0 -210px;}
.price-d span.seven {width: 32px; background-position: 0 -252px;}
.price-d span.eight {width: 34px; background-position: 0 -294px;}
.price-d span.nine {width: 34px; background-position: 0 -336px;}
.price-d span.zero {width: 36px; background-position: 0 -378px;}
.price.black span{background: url(../images/numbering_blackonwhite.png) 0 0 no-repeat;}
.price.black .dollar{background: url("../images/icon_dollar_black.gif") 0 0 no-repeat;}
/*.price.black span.small{background: url(../images/numbering_blackonwhite_small.png) 0 0 no-repeat;}*/
.price.white span{background: url(../images/numbering_whiteonblack.png) 0 0 no-repeat;}
.price.white .dollar{background: url("../images/icon_dollar_greyondark.gif") 0 0 no-repeat;}
.price.blackOnGrey span{background: url(../images/numbering_blackongrey.png) 0 0 no-repeat; }
.price.blackOnGrey .dollar{background: url("../images/icon_dollar_black.gif") 0 0 no-repeat;}
/* global price style colour specific styles must be placed abover this for them to work */
.price {display:inline;clear:both;border:0px!important;}
.price .dollar{font-size:0px;width:11px;height:11px;}
.price.noDollar .dollar{display:none;position:absolute;}
.price span {display: block; float: left; padding-right: 2px; text-indent: -9999em; height: 19px; width: 15px;}
.price span.one {width: 9px; background-position: 0 0;}
.price span.two {width: 13px; background-position: 0 -19px;}
.price span.three {width: 14px; background-position: 0 -38px;}
.price span.four {width: 15px; background-position: 0 -57px;}
.price span.five {width: 14px; background-position: 0 -76px;}
.price span.six {width: 17px; background-position: 0 -95px;}
.price span.seven {width: 14px; background-position: 0 -114px;}
.price span.eight {width: 16px; background-position: 0 -133px;}
.price span.nine {width: 16px; background-position: 0 -152px;}
.price span.zero {width: 16px; background-position: 0 -171px;}
.price span.dot {width: 6px; background-position: 0 -190px;}
.price span.mb {width: 18px; background-image:url("../images/icon_mb_dark.gif"); background-position:bottom;}
.price span.gb {width: 18px; background-image:url("../images/icon_gb_dark.gif"); background-position:bottom;}
.price span.na {width: 50px;height:29px; background-image:url("../images/na.gif");position:relative;top:3px;}
.price span.yes {width: 18px; background-image:url("../images/Yes.gif");width:43px; background-position:bottom;}
.price span.no {width: 18px; background-image:url("../images/Yes.gif");width:43px; background-position:bottom;}
.price span.Topless{width:74px;background:url("../images/txt_topless.png") 0 0 no-repeat;background-position:bottom;}
/*.price span.small{height:14px;}
.price .one.small {width: 10px; background-position: 0 0;}
.price .two.small {width: 10px; background-position: 0 -13px;}
.price .three.small {width: 10px; background-position: 0 -26px;}
.price .four.small {width: 10px; background-position: 0 -39px;}
.price .five.small {width: 10px; background-position: 0 -52px;}
.price .six.small {width: 10px; background-position: 0 -65px;}
.price .seven.small {width: 10px; background-position: 0 -78px;}
.price .eight.small {width: 10px; background-position: 0 -91px;}
.price .nine.small {width: 10px; background-position: 0 -104px;}
.price .zero.small {width: 10px; background-position: 0 -117px;}
.price .dot.small {width: 6px; background-position: 0 -130px;}*/
答案 0 :(得分:0)
您遇到麻烦的一些可能原因:
您确定样式表引用是通过电子邮件发送的内容的一部分吗? (例如,如果您使用外部样式表,则<link>
标记包含在电子邮件正文中)
如果正确发送样式表,您确定用于阅读电子邮件的程序/浏览器/服务是否支持您正在使用的CSS功能?
您使用的CSS规则声明了相对图片路径,例如'../images/icon-price-a.gif'
。当您将输出捕获为字符串并通过电子邮件发送时,这将不起作用,因为相对路径将不再解析为您的服务器。您是否尝试过将完全限定的网址放入其中? (例如url(http://www.mysite.com/images/icon-price-a.gif)
)