.vm文件发邮件时js未生效,无法控制显示隐藏

news/2023/11/30 9:16:39

需求起因

最近在做一个发邮件的功能,是后端发邮件,不过邮件内容是由前端来写。

邮件内容包括姓名、手机号、邮箱,这三个参数都是不一定有的,如果没有某个参数时,那一行内容就不显示。

写法没错,但就是js里面的代码没有执行,不知道怎么控制这几行字的显示和隐藏,可苦恼坏了。

寻求解决方案

后来发现这是因为安全策略,js被禁止了,我们需要弄清楚后端用的什么模版引擎。

咱们后端用的是Velocity,它是基于java的一套模板引擎,它让我们可以用简单的模板语言和后台的java代码关联起来。通过MVC架构,Velocity可以让web端开发和java后台可发同时进行,这样web端(前端页面)开发人员就可以专心于开发漂亮的页面,而后端java开发人员就可以专注于后台一流代码的编写。它让前后端的开发分离开来。

使用Velocity模板的页面文件是以.vm结尾的和.jsp很像。

1、判读语句

#if(条件)内容#elseif内容#end

例子1:

可以用在div、input、a…等标签外

#if($!{userResult.userStatus} == 11 || $!{userResult.userStatus} == 10)<div class="ui-tips refund-nt"><i class="iconfont"></i>代码。。。</div>
#end

还可以用在div、input、a…等标签内

<input type="text" #if($!{userResult.name}) value="$!{userResult.name}" #elseif  value="Hellopocher" #end>

2、循环语句

#foreach(one in ones)内容 ($velocityCount 放在#foreach循环中是一个角标)#end

例子1:

#foreach($!{one} in $!{ones})<a href="$!{one.url}" ></a>#end

3、 与 {}与 !{}区别

例子:

${str}:如果str没有值,则页面显示str本身;

$!{str}:如果str没有值,则页面显示“”(“”在页面上的显示效果就是啥也看不到);

4、#set用法

#set是用来定义变量的

例子:

#set( $name = "pocher!" )
Welcome $name to oschina.net

执行后结果:

Welcome pocher! to oschina.net

总结

Velocity就是Servlet + Velocity的模式,早期我们使用的Jsp开发模式Jsp+JavaBean。

我们更改为Servlet+JavaBean+Velocity,想想是不是已经替代了Jsp+JavaBean,并更彻底的把Java代码去除在Jsp(vm)外,如果光使用Struts(Servlet+Jsp),那么带来的代价是Java代码总或多或少出现在Jsp上。

即使可以做到不出现Java代码,但做过复杂架构系统的开发者都知道,代价也是很昂贵的,并且在可维护性、和网页设计师的集成开发上存在一定的困难,所以我们在这里能感觉到,Servlet+JavaBean+Velocity的模式较好的实现了OOD的概念。

而在效率上,大家也不用担心,此种结合方式比Servlet+Jsp的方式要高效一些。

邮件的写法可以看以下代码:

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1,maximum-scale=1,user-scalable=no"><title>邮件通知</title>
</head>
<body><div class="container"style="padding:30px;margin: 80px auto;width: 640px !important;min-width: 640px;box-shadow: 0px 0px 20px -4px rgba(90, 94, 109, 0.14);border-radius: 8px;"><div class="header" style="padding: 20px 0 10px;border-bottom: 1px solid #EBEBEB;"><img style="margin-bottom:10px;padding-left: 20px;" src="https://oss-emcsprod-public.modb.pro/image/indexlogo.png"height="33px" width="113px"><div style="display: flex;align-items: center;justify-content: space-between;padding-left: 20px;"><span style="font-size: 14px;color: #5A5E6D;">开放、便捷、专业的数据库社区</span><span style="font-size: 14px;color: #5A5E6D;"><a style="color: #5A5E6D;text-decoration:none"href="www.modb.pro">www.modb.pro</a></span></div></div><div style="padding: 50px 40px 30px;"><div style="font-size: 20px;color: #2B2B2B;margin-bottom:20px;">收到新的【BethuneX】购买咨询</div>#if($phoneNum)<div style="font-size: 16px;color: #2B2B2B;margin-bottom:20px;" class="phoneNumdiv">手机:<spanstyle="color: #3D5F98;">${phoneNum}</span></div>#end#if($userName)<div style="font-size: 16px;color: #2B2B2B;margin-bottom:20px;" class="namediv">姓名:<spanstyle="color: #3D5F98;">${userName}</span></div>#end#if($email)<div style="font-size: 16px;color: #2B2B2B;margin-bottom:20px;" class="emaildiv">邮箱:<spanstyle="color: #3D5F98;">${email}</span></div>#end<div style="color: #4285F4;font-size: 16px;margin-bottom:50px;"></div><div style="font-size: 16px;color: #2B2B2B;margin-bottom:10px;">再次感谢您的支持!</div></div><div><div style="border-top: 1px solid #EBEBEB;"></div></div></div>
</body>
</html>

image.png

最终实现的是,如果没有邮箱,就不展示邮箱,大功告成~


http://www.ppmy.cn/news/594841.html

相关文章

光标变成黑色怎么解决

1 现象 出现黑色光标 2 原因 用eclipse或者idea可能会误触insert Insert键能够切换 | 光标和黑色方块光标&#xff0c;出现黑色光标&#xff0c;很可能是按backspace键的时候误按了Insert键 3 解决 此时再按下Insert键就好了。

eclipse 中代码突然变红变绿变黄

如图所示&#xff0c; 解决方案&#xff1a; 哈哈 &#xff0c;随便摁一个 enter

心爱的白色衣服不小心被染色了,怎么洗都不干净,怎么办?不要紧,试试下面的办法,或许您的白色衣服就亮白如初啦!

热肥皂水法 把被染色的衣服先放入清水中泡一泡&#xff0c;然后再放入煮开的肥皂水里面。泡十分钟左右&#xff0c;用手揉搓一下&#xff0c;白衣服就焕然如新啦。 84消毒液法 白色衣服不怕掉色&#xff0c;所以可以用84来解决染色问题。把84消毒液用水稀释&#xff0c;把衣…

[已解决]解决IDEA突然引用的类突然变红的问题

在运行项目的时候&#xff0c;突然就出现引用的实体类出现变红&#xff0c;但项目能正常运行的情形&#xff0c;解决方法&#xff1a;点击File->Invalidate Caches...按钮重启IDEA即可&#xff01;

eclipse代码变红解决办法

点击windows>show view>other>Java>Coverage 然后点击右下角的双❌

突然变红码了

一大早出门上班&#xff0c;刚走到车站&#xff0c;就收到居家办公的通知。 回来路上看了下健康码&#xff0c;突然就变成红码了。

关于sendMessage(),sendEmptyMessage()变红的问题

自学andriod编写一个APP&#xff0c;遇到问题&#xff0c;这里记录一下&#xff0c;我使用的环境是Andriod Studio。 首先&#xff0c;我遇到的问题是不管是sendMessage()还是sendEmptyMessage()程序都会变红。如图 我们都知道&#xff0c;Andriod Studio在没有加入头文件的的时…

解决pom.xml文件图标变红问题

环境 idea2019.2.4 问题描述 当我们更换project项目工程时&#xff08;或者其他可能&#xff09;&#xff0c;pom.xml文件可能会突然变成红色图标&#xff08;普通.xml文件的图标&#xff09;&#xff0c;这样我们的项目是会报错的&#xff0c;没办法运行。 问题原因 点击i…

Typora文字变红

Typora是一款非常优秀的markdown语法编辑器。 但是&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01; markdown语法居然没有文字标红&#xff0c;这就很尴尬了。 所以&#xff0c;我终于找到了怎么改变字体颜色&#xff0c;为大家分享…

如何让网页变灰色

在一些重大节日&#xff0c;如何快速使网站网页变成灰色&#xff08;黑白色&#xff09;&#xff0c; 在网页的<head>标签内加入以下代码&#xff1a; <style type"text/css">html {filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale1)…

Shell 中的颜色

一般做法&#xff0c;看图吧 色彩黑红绿黄蓝洋红青白前景色3031323334353637后景色4041424344454647 tput简单涂色&#xff08;推荐&#xff09; tput 命令会利用 terminfo 数据库中的信息&#xff0c;来控制和更改我们的终端&#xff0c;比如控制光标、更改文本属性、控制屏…

Spring maven配置变红

1创建maven 新建spring文件夹 idea file open 选择spring new module maven &#xff08;因为在这歩没有选自己的本地仓库&#xff09; 在pom.xml中加入 然后右键maven选择Download Sources and Documentation 这里选择自己的Manven和自己仓库 在Manven\apache-maven-3.5.2\…

idea中创建springboot项目文件变红解决(二)

1.创建文件是出现文件变红 在上述文章中提出了解决方案,但是不能每次都这样,当发现是Git管理工具的问题时,我去看了设置,发现设置也有问题,建议将设置中也修改一下 进入设置File----settings----Vsersion Control----Confirmation 将上述两个选项都勾选上,下次创建文件时,就会…

excel背景色怎么变成黑色了?

excel是常用的表格数据处理软件&#xff0c;如果能够熟练掌握该软件&#xff0c;可以极大地提高用户的工作效率。下面小编要给大家介绍的就是excel背景色变成黑色的解决办法。 1、修改填充颜色 首先打开一个黑色的EXCEL表格&#xff0c;如果背景是部分单元格黑色&#xff0c;可…

笔记本c盘变红满了怎么清理呢?有什么好的清理方法?

很多朋友会发现&#xff0c;在笔记本升级到最新版本系统之后&#xff0c;c盘的容量容易出现变红爆满的情况&#xff0c;这样的话&#xff0c;就会导致系统运行速度变得非常慢&#xff0c;这时候就需要我们及时进行清理&#xff0c;清理的方法也是比较简单的&#xff0c;而且也比…

CSS控制图像变红

css制作hover变红效果&#xff0c;对于文字只需要设置color&#xff1a;red&#xff0c;但这对于图片无效。 图片变色的方法&#xff1a; CSS3 filter(滤镜) 属性 有多种滤镜&#xff0c;多种方法&#xff0c;这里使用svg滤镜 filter:url(#colorMeMatrixRed);代码&#xff1…

yml文件变红

yml文件变红 目录 yml文件变红原因文件夹标记 原因 打开项目配置文件这样子&#xff0c;先是查看idea的modules&#xff0c;配置没问题。后刷新maven也没问题。 文件夹标记 原因是resources不是 Resources Root 文件夹&#xff0c;需要标记

eclipse代码突然变绿变红变黄

在用eclipse写代码的时候突然遇到这种情况 &#xff08;此图来自网络&#xff09; 百度了好久也找不到解决办法。 产生此情况的原因&#xff1a;在debug 的时候未关闭debug就开始运行项目&#xff0c;就会发生这种情况。 解决办法&#xff1a;方法一&#xff1a;重启下eclip…

Eclipse下代码字体背景变红/变绿/变黄原因

如下图所示&#xff1a;不知道怎么&#xff0c;在eclipse IDE手抖按了啥&#xff0c;就成这样了。 后来在stackoverflow提问后&#xff0c;找到了原因。 eclipse 有测试代码覆盖率的功能&#xff0c;也就是执行Run——>Coverage后会出现这样 的效果 如何清除 网上有…

局部字体变红

1、布局文件 <TextViewandroid:id"id/tv_red"android:layout_width"wrap_content"android:layout_height"wrap_content"android:layout_gravity"center_horizontal"android:layout_marginTop"50dp"android:text"He…
最新文章