动力节点SSM框架项目【CRM客户管理系统】实战教程-131原创

好，大家看我们说这是一个什么修改图标，当时我们说了这个修改图标是不是和这一条备注的ID绑定啊，ID绑定以前我从作用里边取，现在从哪取啊。这条备注的ID从哪取到？对，是不是从return data里边取到，后台添加完之后返回了，所以从return data那取的话，还是叫什给他一个引号，让他这个地方来个叫data.return data return data点叫什么。ID这些权利，这是修改图标，下边还有个删除图标，同样道理，先把双引号转移了，然后呢，这个地方转移了，好下边的他是不是也得绑定那个ID啊，对这个ID绑定ID也是从data塔这边取，然后呢，这个data塔来一个点叫什么return data点对ID，哎，怎么不给我提示，又变过来了，这个对这对。

这样就行了，这样的话再看这一条备注我就拼完了，大家拼的时候主要是那个，主要是难点在什么，就是你这数据从哪取。其实拼的语法大家都会了，主要是这些数据从哪取，那数据从哪学，你要非常清楚这个流程，这些数据从哪来到哪去，你要非常清楚。啊，不清楚，你就好好画一画这个流程啊，好，你也可以用个纸，用个笔画一画，这些数据从哪来到哪去的，一定要清楚。啊，不清楚也可以问老师知道吧，这个流程每一位同学都要非常清，非常清楚，写代码之前都要非常清好，这时候我们说的这样的话，我们就拼好了，拼好之后再看这一个什么，这一条备注，所有的信息都在这个字符串里边了，然后把这个字符串显示到这个页面上面就行了，追加显示到这儿就行了。

那如何把我们的一个拼好的字符串里边表示的一些标签显示到页面上面呢？怎么显示？用什么？对，目前我们学的把拼好的一个什么页面片段显示到页面上，目前我们学了这几个函数，哪几个函数，第一个我判断是不是这样的，还有一个什么HTML，还有一个什么T是目前这三个，目前现在现在大家就学了这三个把一个这把看把这个我们这。把一个什么这个页面页面片状显示在，然后呢，页面红追是叫什么？动态的显示吧，就是用GS代码动态的显示在页面中，页面中我们现在学了这么几页面中学了这么几个，学了这么几个函数啊，一个是一个是al，一个是PA，它们的语法都是这样子的。

都长，你要把这些什么，这个字符串都在想到哪个页面中，对选择器是不是找到那个元素啊，找到那个元选择器要想让哪个页面哪个元素当中选择器找动的元素掉下的看断，然后呢，大家看把我们在这个什么，把我们的字符串写到里边就行了，叫HTML的一个字符串写到里边就行了啊。这容，那它的语法也是这样，选择器是吧？点啊，然后呢，后边也是这样函数啊，它的语法也是这大家的语法都一样，但是语法一样大看不一样的地方在什么呢？对各自的效果不一样，这个效果是什么效果对追加显示在这个某一个标签的内部的后边是不是这样么？叫追加显示在页面的这个指定标签的定标签的，然后呢，内部的后边这个呢，覆盖对覆盖显示覆盖显示在指定标签的内部知道吗？再一个呢。

也是覆盖，它俩不一样的地方就是它可以显示什么，对HTM2，它只能显示文本信息，是不是这样的，这个啊大家这是我们以前学过的，那我们这个地方用哪一个呢。添加一下备注用哪一个呢。对，按理说是不是得追加了，你要用覆盖的话，是不是人家以前有的备注也覆盖了，对所以目前来讲只能用了嘛，对只能用这个APA就只能用。

那大家看我们说只能用a panda，那我们用假如说用a panda，那我要做的话，首先得干什么？对，找到这些备注的一个副标标是吧，那找副标志找一找哪一个标签来找一找吧，只要找到副标一个判断其实就行了，那找副标你找一找这些备注，那往下边找了。这是以前的那些备注，是不是让子你得找他们那个副标签，副标是谁呢？这个是这个吗？对在上面是不是这个，这按理说找到它。然后给他一个did小的找他啊，判断一下就行，但你再一观察是吧，你看吧，它除了包含这些标签，还包含谁啊，对下边这个东西。其实他这么那个那个副标签到这下边这些是什么，就这些东西看到了，对也在那个div里边，你你判他跑哪去了，对追加到这儿来了，所以显然这个是也不太合适。

那这个也不太合适，那这俩也不行，那咋办呢，往上。对，还有这还还有这样的，大家以前学解块的时候，我们说动态的显示页面的内容的话，除了这三个函数之外，还有呢，还有哪一个跟相对应的一个函数，哪一个叫这个，对阿阿啊，都是追加显示在后边。它的语法也是这样，你想最佳显示在哪一个页面的后边，选择器调阿尔，然后呢，把这HTMLSTR这个字符状显择到，那你说它也是追加显示一个标志的后边，但是它追加显示跟upon的追加显示不一样的地方什么？Upon是追加显的指定标签的内部的后边，对子标签它是追加显在什么对指定标签的外部的后边。

是吧，同级的那章他是这样追加显示，它也是追加显示，是显示在指定标签的外部，是外部的后边啊。就这样，这是我们这，那你说他到底有什么不一样，什么外部内部，当然我们给大家简单举个例子，你说你比如说他啊，是你比我有这么一个标签，假如说这个div。Div就这样吗？然后给他一个ID，假如我随便来一个叫my div知道吧，然后呢，它里边本来有内容，有这么有这么两个内容，知道吧，好这样，假如我还有个标签，这个标签是个段落标签是个P，知道知道吧，然后呢，这个地方来一个CCCC，知道吗？然后呢，它这个呢，我想动态的把这个P标签显到div后边，我就可以把它拼一个字符串，拼个字符串，定一个变量。

HTM2FT2等于是然后呢，把它定个逗块，这样那我追加显示的时候，我想把它显示到它的后边，我就可以这么回这么来做包了符号啊，拿到它的解刨的对象点追加显是呃判断，然后呢把HTML这个字符串相示这执行完的结果，执行完结果是这样的。把这个标签追加险的指定的这个标签内部，内部的后边最终的结果是这样。叫最终结果是这样，执行完之后，这是内部的后表，那你为老师用阿呢，用阿同样的代码带款，同样这个代码我用阿的追加线指导时，假如说这个地方掉阿，执行完之后呢，对，它也是追加到这个指定标签的后边，但是它是在外部的后边，你知道吗？

是这种结果。所以刚才这个地方大家我们说我一拿到那个副标签，如果是a panda，它会追加想到这，那我想一想阿可不可以阿负，那你就不能找那个副标签，你得找谁啊？对是不是最后一个备注的，就是最后一个备注那个div标签找到它之后1AFTER是不是就追加到最后了？对，找到它之后就行，那找这个最后一条备注好找吗？对，不好找，为啥不好找呢？对，循环出来大家这些备注是不是都一样吗？你想找哪一个，最后一个其实不好找。

那不好找怎么办？对，还有一个函数是吗？对，还有一个给它相对应的一个函数，给这个什么阿？相对应的一个函数也是追加显数是吧？对，也是追加显数，它叫before before它是什么？表示追加险的指定标签的外部的前边，外部的前面。它是什么意思呢？它显示的效果就是这个，你比如说大看我们这个它显示效果，这同样我还是这个标签，还是这个字符串，然后呢，我要用北去追加减的话，结果就是他跑到前面去了。结果就是这样。所以大概我们通过我们的分析，找他不好找掉他的阿，不好找，我找下边这个标签好找呢。好找，因为下边只有一个标签，加个ID就行，一调它调个北是不是可以调它after是效果是一样的，知道吗？所以这是我们知道，所以那我们就用北方网那找这大纲，其实就找他这个叫remark remark div这个ID美工也给加上，直接调他一下北方一下就行了，所以我们这个地方就可以找啊。

然后呢，这个地方继续了，拼接好之后，把这个字符串追加显示，不是追不是追加显示照就直接before去显示了，调那个什么before，拿到那个下边那个div之后，Before把谁HTMLSTL装过去，这样就显示好了，知道吧，就显示到这个地方了，知。好，这是我们说的阵容，下边的话这是成功了，下边失败了，失败了我们说提示信息，提示信息，那提示信息来个alo，然后data.message这就好办了，那这个框不用清空，这个地方也不用刷了，也不用拼了，这样的话整个我们这个前台有效果。

前台最主要的就是这拼这。拼这个时候主要这里边数据是个难点，再一个如何把拼好的字数显示到我想显示的地方。所以这也是一个难点，其实最难的是这个，还是这个流程，最难数据从哪来到哪去。这些数据从哪取，像这些其实不难，你说老师这这好几个方法对我来说很难。你以前没用过可能难，但是现在给大家总结出来了以后在页面上显示任何字符串，就这几个方法就完全可以解决了。知道吧，就这五五个吧，五个方法。你一用过一次你就都会了，知道吧，所以语法都不难，语法不难，主要是这个地方以后再做别的项目，这些数据又变了，哪些数据从哪来到哪去又变了。

语法都是死的，这些业务业务是活的啊，啊，所以我们还是给大家强调这种流程，这些业务知道就算那个按钮是自动弹。自动弹出来是吧，是不是哪个地方改错了。有的地方写错了。报错了，对这个地方写错了是吧，执行到这儿报错了，报错了他就不执行了，嗯，就执行哪一行，这是拼这个下拼这个图标的时候懂吗？删除图标的时候，这个东报错了，看报错了，当然大家看像这页面本来我们没动它，我们都没动它就出不来了，肯定是由于你写某一方代码写的不合法，不符合语法和报错，那你思说怎么看这个对F12，到时候我才给你提示，你看看哪个地方错了，这是这拼这两代表哪个地方错了。

这个地方错了，对，没转移是吧，转移了就行了，这个地方。对，报错不怕是吧，报错不怕大，要会调代码，这是事，对，但调代码怎么调，哪儿出不来，就考虑那一块咋出来的，他出不来了，那那一块肯定有问题了，知吧，前台出不来，看前台知道吧，对后台的数据出不来，看后台知道，一直往上找就行，那我们这个地方前一找前台，那么前台就是往报错了，所以这时候我们这继续来吧，嗯。对，这是其实这是大家以后开发的一个常态是吧，你写代码不可能一把是吧，全写对了是吧，那你太太厉害了吧，对太太厉害了，他一定会出现各种各样的问题的，这是一定。然后呢，这个地方哎Y部下三点进来，然后呢市场活动，然后呢点进来这个地方好，这就出来了，看吗？然后呢，这个地方来一个备注测试测试零一，然后呢一点保存，大一点保存啊，我保存到再来一个备注测试，然后呢零二你点保存间带上，又给我追加到后边。

呃，那有老师我再进来，这这这俩备注有没有。有没有，嗯，你看看再进来有没有对，一定有，为啥有，就你添加时候已经保存了数据库了，查到时候是不是又查了，又查了，查了也显示出来了，你肯定了对，所以我们这个是吧，这个逻辑都设计好了，你只要写的对，结果一定是对的，知道吗。啊，这是我们这个添加备注，我们这个地方先做到这，好下边大家休息会休息会看看别的功能，好大家休，嗯，好然我们刚才做这个添加啊，添加市场活动备注这个功能做完了，当然做完的话，当然这个地方还稍微有一点点问题，不知道大家发现没有哪个地方在我这个地方还有一个等这个地方有点问题，诶这个地方再看怎么一直点修改你看。

那么。咱们刚刚创建的备注应该是什么？对有让他创建的吗？他要点修改，那说明这个地方有问题是吧？那有什么问题你看看再看看看，那那你说这个有什么，那你就看看，就显示这一块的，既然显示的不是我不是给我给我的预期不一样，那就给我看看这张代码，这张代码在哪呢。对，在这个页面里边是吧，在这个页面应该是显示已经这个存在哪些市场活动，在这个地方有个三步运算符，这个地方是不是这样的。在这个地方，这个地方有问题吗。如果等于一知道吧。等于一应该是什么？等于应该是修改，应该是修改是吧，等于零才是创建吧，所以那我们这个地方，你看大家写的不写的不对了啊。

等一，那应该是那个修改是吧，等于一，那就是修改，那这个地方显示修改，嗯。不等于一等于零的时候，是不是才显示创建呀，对这个地方有问题，这样这样把它俩换过来就行了，嗯。好，这是我们这个地方啊，这是它，那除了这个地方呢，还有一个地方有问题啊，但是我们这个地方大家你看启动下，我们测一下这个地方就没问题了，还有一个地方有点问题，那你看还有哪个地方有问题，对看一看啊，我还有一点问题。啊。然后呢，这个地方来一个张三。

YF123点进了，然后呢，市场活动，然后我再点上去看吧，这个就改成创建了，这才是我们符合我们的要求，符合我们这个需求啊，还当然除了这个问题还有一个问题，还有什么问题，大家你看咱们这些备注，你看吧，咱们这备注将来那么当然我鼠标放上去之后，你看后边是不是俩图标就显示出来了，鼠标移开这俩图标就没了，你看这俩图标这有这有修改和删除图标来你我再再加一条，你看没有对备注测试零三，然后我一点保存你看。刚刚创建这一条你看吧，鼠标放上去看吗？就没有你看吗？但是上面这俩就有你。然后大家你看我再进来再看，再进来看，再放进这个地方就有了啊。那要再添加一条，你看备注测试零四一点保存，添加上鼠标放，你再看它有没有，但是上面这些都有。

那我说新创建的，我也有可能修改删除，所以这俩图标我也应该显示出来。所以大家那这个地方应该怎么解决，就这是一个小的bug标签。对，怎么解决的，那怎么解决？要解决一个问题，你首先分析一下这个问题产生在什么地方，把原因找到了就好解决了。那那你分析一下，他看为啥说那么从从这个市场活动明细页面上面一进来的时候，这些什么已经有了，这些备注一放上去，诶这个图标都出来了，鼠标放到图标那变变红色鼠标移开变灰色，鼠标再移开这条备注的时候，这个图标显示这个消失了，鼠标又放到备注上边，它后边图标显示出来了，放上去变红一下变灰了，你知道吗。然后呢，大家我们说那为啥出现这种效果呢？件对它一定加上事件了是吧？加什么事件，你看看鼠标焦点对鼠标悬停事件，鼠标放你悬停，悬停在哪儿，给每一条备注是不是都有一个div了，放到div上面，悬停在div上面，肯定给每一条备注div都加上鼠标悬停事件，鼠标一放上，图标显示出来，鼠标一移开这些div，它后边那两个图标就隐成了。

同样，鼠标放到图标上面变红色，鼠标移开变灰色，一定也给这两个图标加上单，加上鼠标悬停时间和鼠标移开事件。鼠标放到图标上面变红，鼠标移开变灰。知道吧，他一定加了这些事件了，给每一个div加上鼠标移开和鼠标悬停事件，给这两个图标也都加上鼠标悬停和鼠标移开事呢。那加事件的方式，我们前面给大家讲过。那什么样的方式，我们说两种方式，用解剖位给给元素加事件，两种方式对第一种方式，就咱们的传统的的方式，给什么样的元素加事件，选中什么样的元素，拿到他们的解块对象，调事件函数就行了。

这是传统的方式，还有一种方式是什么？昂，那种方式是吗？奥那奥那种方式的语法是首先拿到给哪元素加事件，找到那些元素叫已经存在的什么固有的叫副标签，找到之后呢调啊，然后里边传试件，类型目标选择器，还有回调函数，知道吗？这两种方式有什么不一样？第一种传统的方式只能给固有元素加上视角。对于那些后来动态生成的元素加不上，后边按这种方式既能给固有元素加设呢，也能跟什么动态生成的元素加设去是那我们这种方式大通过我们这种演示的效果的呢，他这种式虽然我们没看他的代码，你能不能猜猜给他们给这给这元素加世界图，他采用哪一种。

对，传统的那种方式。为什么传统刚一进来已经存在着这些备注已经加载完了，加载完了那能加上视角刚刚生成的一点保存，刚刚生成的我是动态，后来动态生成的，动态拼出的是固有元素，所以加不上，所以这这效果就出不来，知道吧。所以这是我们说的这种是吧，那你不信你可以看一下它代码工作，那你看那加试件的代码在哪呢？在这种对你看这个明细页面上。这歇班点进来那看看就这个这些单看。就是给这些元素加视角的，前两个是给那个每一条备注的div加上鼠标悬停和鼠标移开的视，还有下边这是给两个图标加上鼠标悬停和鼠标移开时间。

那你看一看再看，首先来看看这个吧，这个元素它采用传统的这种方式，首先给哪些元素加视角，选中哪些元素拿到结块对象，它这个用的什么什么选择器啊，是不是类选择器啊，类选择器。找到那些什么class里边含有remark div的那些标签，加上鼠标mosover悬屏事件，哪些元素是class里边有remark div，你看看哪些元素是不是就是每一个div啊，对每一个div，每一个remark div都有，加上鼠标旋择事件干什么？当你鼠标放到任何一个备注上面的时候，都会执行这个代码，这里边代码干什么呢？可首先V4标示谁啊，对，就是当前这个元素啊，当前这个备注啊，就是这个div，你鼠标放到哪个div上面，它就代表哪个div，然后它到后边干什么？找一个指它下边一个指标签，哪一个指标就那个div，它下边就是div，你看大家看啊，现在我们鼠标是么放到一个div上面。

然后一放到上边，他就找他下边一个div，就是这个div知找到这个div，然后再找谁啊，他下边再再再往下再找一个div，你看啊，再找一个div找到它了，它下边一个div是谁？这一个干嘛，这个div里边有啥两个图标吗。两个A标签，那两个A标签怎么了？你看看找到那个div，那个div里边有两个A标签，收一下收标什么？对显示就是把有两个D有两个标这个什么，有两个图标的那个div显示出来，那那两个图标就显示出来了，知道当你鼠标放到任何一个div上的时候，后边那个图标就显示出来，就它后那个图标就显示出来。放到谁上边，谁后边那两个图标就显示出来，知道吗。那同样大家鼠标下边这个鼠标移开时间，也是给那些div加上鼠标移时间。

当你鼠标一移开某一个div的时候，它还是找到什么下边包含图标两个图标的那两个，那那个div找到之后还隐藏掉，所以我们鼠标一一开，它后边那两个图标就没了。这是我们这样子，下边你看这两个大上这一个是给也是一个类选择器，是给那些class里边有my hi的那个标签加了鼠标悬。哪些标签有克拉斯买等于买AF，你可找一找就这两个图标吗？对，当鼠标放到这两个图标上面的时候干什么，你看。找到它里边有个死SPA，它里边死SPA谁呀？就这个A标签，它这边有个死SPA，这个死SPA是什么？你看啊，死死SPA他写的A标签里边，那就是在这个超级链接里边要显示的那种，显示什么内容，其实就是个就是个图标，它用CSS做出来效果就两个图标知道吧。

标示图标啊对，那找找着这的图标怎么了，你看看你鼠标放到哪一个图标上面，图标找到那个SPASPA干什么？对，修改颜色变红，鼠标放上去就变红了，你放到任何一个图标上面，它就变红了，下边这个是给那些图标加上鼠标移开时间。当鼠标移开的时候，颜色变什么，变灰了，这你说老师它这个颜色怎么这样，我们说颜色在编程领域当中有好几种表现方式，对这是这一种叫什么？对一个井号是一个什么，是一个16进制符来表示表示颜色，那你说上面这个地方能不能用到上面这个红色也能用它。它也对应一个16金素，但是我你说老师这个什么，为什么用red red方便方便，所以我们用颜色在，哎在这软件开发领域用颜色其实有好几种写写法，其实最主最主要有三种，哪三种，第一种。

用单词对单词，单词叫做玉质，色叫玉质。就预支色。预制颜色就什么意思，就是这单词呢，这些浏览器已经预制到浏览器里边了，表示颜色的这几个单词是什么样子的，你一写这个单词，哎，他就知道是什么颜色了，这是玉质啊，那你说老师我直接写这个可不可以别这么写行吗？对，这样不行，因为汉字没有预知的。为啥？因为这些技术都是老外开发的，如果这些，如果这些技术，这些标准都是中国人定制的，那你写红色也行，知道吗？所以这些还是这些标准，人家定义了人家的为了什么，他们那些人的用法方便的话，那所以说他们这个他们预制的啊，啊，但是这是预制颜色，当然我说预制颜色用的时候方便，你只需要记几个单词用了，但是我们说他用的时候它有局限性，因为什么？因为表示颜色的单词总共就那几个是吧，你要用别的颜色，那可能就没有相应的单词了啊这这时我们说这那那怎么办？用另外两种表示方式，一个是井号，一个16电制数，它可以表示世界上任意的一种啊一种颜色知你只需要变不同的值，知每一个呢，变变，每改变一位的值，它就是它就表示一种颜色，当它这个颜色是渐变的，是颜色的大小，就是一渐一改变一点，它的颜色就给你改变一点。

就这对，这是我们这还有一种表示颜色的这玩意对用个什么对RGB，那么RGB这里边有什么，有三个值，三个值，这三个值分别分别表示什么，也是什么，这分这是什么，三个数值，这三个数值分别表示。把整个三种颜色混三种基色，对它们的大小不同分别表示三种基，按照三种颜色混在一起的那个比例就不同。

大家都知道，大家学过这种绘画的人都知道吧，是吧，在颜色世界里边有三种基色是吧。三种机子，哪三种机子？是红绿蓝吗？我也我也我也不会啊，我也记住我也没学过这个，我我以前就是学过这个绘画是吧，但是我忘了很小时候学的是吧，都都忘了是吧是吧，但是反正总之吧，就是三种世界上三种基色，这三种基色混在一起是吧，比例不一样，能够表现出来世界上所有的颜色。这个值的大小不同，他们的比例就不同，那出现这种混在一出现这个混在一起出现颜色就不一样是吧，所以这种也有这种表现方式，这种颜色，当然我们说你说老师以后我们用什么，也就这俩用的最多的，为啥他俩方便，这个是最方便，当然他只能表现几种颜色，所以大家以后用的这个用最多，你说老师这个可不，这个也可以写到里边，当然你这个写的时候比较麻烦，你得确定三个数字知道吗？所以大家知道这种颜色，这种大，看这个他就用这种用种灰色石榴金素。

好，这时候我们要跟大家说到这个，关于他这个。这个问题的所在知吗？问题就出在他给这些每一个备注的div已知，以及div后边这些图标的A标签加的事件的方式其实是不对的。啊，它采用的这种传统的方式，只能对固有元素加上视角，那我们为什么要把不但固有元素加上视角，还要把动态生成元素也加上视角，那这个时候是不是我们可以给他改造一下，都改造是什么？On，这种方式加视角就对了，好，下边我们来找，那大家先一个一个改吧，先改这个吧。给所有备注那个div，所有备注的div都加上鼠标悬停时间用on那种方式加了，应该怎么加，先把它这个注释掉，应该怎么加？对是不是找所有这些备注的div他们的一个副标签，而且必须保证副标签固有元素，那哪一个标签？

对所有这些备注的一个副，固有的副是不是往上找去往上找，你找一找吧，这些看看。这是所有的备注，对，往上找找谁呀，这一个是吗？对，这个不是是吧，谁呀，是不是这个其实在网上找是不是也行啊，那我们说越小越好，找到它固意要做检查，那我一会要选它，给它加一个ID，这个ID你随便写啊，我就建名，这就叫remark div list吧，因为它下边都是一些div，你知道吗。然后呢，首先拿到它的解刨对象，它就是固所有这些备注div的固有的负元素，然后呢，找到它就行了，拿到它的这个选择器，解块的选择器，这是固有的负元素，下边掉啊下边掉啊行，然后呢在这里边传插了三个参数。

对，第一个参数表示事件类型，这里边写什么？对，Mo overver，鼠标悬停视角，我们说它这个事件类型跟试件函数是一一对应的，大小写都不带变的，知道你以前加的猫，我这段方也是猫ver，你知道吧？所以下边的话来一个目标选择器，目标选择器选什么就写对，是不是也是根据类选择器去选就行了。对，以前放到整个页面当中，我通过录类选择器就能选中那些div，现在我在它下边当然更能选中了，所以还是这个类选择器，就每一个div都有一个，那class等于remark div知道吧？好，这是目标选择器选下边视角函数。

然后呢，这个地方不是这个回调函数知，那回调函数里边写什么，写上对上面这一点代码都不用的，都不用变。包括这个this代表的还是这些。某正在发生这种事件的那个div，知道吧，因为我们写法上其实跟以前那个没什么区别，就是加了一个复元素知道吧，这是父子选择器，所以一点都不带变动，还是涨。这样的话，大概我们这个给这些div都加上这种鼠标的鼠标的这些悬停事件，这时候我们这那同样鼠标移开始讲是不是也同样的道理啊，把它注射掉就行了，然后呢，这个地方，哎，然后呢，这里边呢，直接拷过来就行了，对，拷贝一下副元素是不是还是那个副元素，那这个世界类型是不是改一下就行了，改成Mo off目标选择器呢？对，不用改，还是那些div。

还是给那些div加上鼠标移开时间里边在代码是不是得变一下，得变一下把它的代码拷过来就行，就是鼠标移开之后，把那把那个div知道把那个什么显示图标的，你知道显示图标的那些div给它隐藏掉就行了，这是我们说到这个，同样给那些图标加鼠标悬停事件这个代码也给他改造一下，那改造的时候还是那也要拿到这个图标的一个固有的富养族谁要。对，给这些图标找到他们的部位的非常多。谁呀？这些图标他们的固有负氧的谁啊，按理说他是负氧素，这是他负氧度，能用它吗？不能是吧，因为它也是动态的，那再往上找它呢，也不行，对它呢也不行，是不是还得往上找啊，固有分是不是还是我们刚才那个div啊，对那个list那个div还是它。

还是它就这啊，然后呢，这个地方那个高符号这样，然后呢掉二掉一下，然后呢，这里边一个事件类型，那事件类型那肯定还是鼠标选定事件了，所以给这些图标加上鼠标选定事间，目标选择E是谁啊是不是还是这个克拉还是这个克拉斯一样，同样道理，那下边回调函数，反正是然后呢里边代码肯定也是都一样的，是好同样大家给这些图标加上鼠标移开时间，鼠标移开时间。那这个地方也是一样，我把这个代码直接拷过来了，副元素还是它，当然事件类型改成Mo out，目标选择器还有他，然后里边代码把这个地方直接拿到。

那这样的话，大概我们这个这四个加世界的代码都改好了，改好之后这个时候不管是固有元素还是动态拼出来的这些元素都能加上世角，好，下边我们来启动服务测一套啊。对。干了。然后呢，这个地方来登录张三YF123推车登录，然后呢，市场活动我还是看他的明细点进来你看啊，大家看这个地方大看鼠标放上去，你看显示出来，鼠标一开隐藏掉，鼠标放在图片上变红色，鼠标一开变灰色知但固有元素功能没有改变，你看我再新新添加一个备注测试零四啊。

零哎，零有个零四了，再加一个零五，然后呢，加一个鼠标放上去看，我显示了鼠标移开隐藏掉啊，鼠标放到图片上变红啊这。这是我们这样的话呢，我们这个地方加好。好是吧，加好之后还有一点问题，好还有什么问题，你看大我加的时候这备注你看吧，显示都没按顺序显示你看吧。按理说大概我就像给大家以前时候，大家看新闻的时候有一些什么，看那些评论时候，一般都是按照时间的顺序给它，给它显示后创建的显示到下边，先创建的显示到上面啊。

那这个时候他看我们说想让他知道显示这备注的排下去怎么开。对，是不是查这些明细的时候，查这些备注的时候，给咱们排个序就行了，排个序按照什么排序，对创建时间排序后串现在显示到后边升序还是降序。后串线的显示到后边声序是不知道，所以我们把查备注的这个骚扰语句给它改一改，对查备注的骚扰句这个地方。就是这个，我们这个写这个备注，上次写那个查备注搜出去，我们当时只是查了一下而已，并没有排序，下边排下序order对根据谁啊对A点叫什么time升序升序对对你不写也行，不写也是默认就是升序，但一般来讲对带上的话更明确一些，嗯，这样的话我们就可以了。

好，这是我们这个地方啊，这是我们这个关于这个啊，查看市场活动明细以及添加备注啊，查询备注这一块内容我们就做了啊，好，下面我们来看看这个啊。所以大家我们在课堂上跟上思路，课下自己敲出来的啊啊后呢，这个地方来一个张三，然后这个地方来个YF1要点进来，市场活动点进来，哎点哪一个点这个，这样的话就按照创建顺序来显示了。这你看鼠标放上去，好像咱们都是用张三创建的，对，咱们都是用张三创建。对，这样的话呢，我们这个创建这个添加备注，我们就给大家做到这了，好，我们还是简单画一个流程图，在上面来画一个流程图，这个流程图叫删除摄红备注，删除市场我种备注知好，然后呢，这个地方来话筒，话筒我们说任何流程都是从客户端发起的，都是从浏览器上发起的，这是客户端，客户端如何发起这个删除备注的这个流程。

他是需求说的很明白了，说用户在市场部的明细页面上，他想删哪个备注，点击删除备注的图标，点击哪一个备注后边那个删除图标，用户点击啊市场活动备注后边的删除图标，就删除图标。他想删哪一条备注，那他就点这个图标，一点图标，大家发生什么事一点它你看。

是不是要向后台发请求了，为什么发请求？因为数据在后台呢，我想删掉，我要到后台去删除去。所以必须相互，哎，那有同学说老师以前不是一删数据还弹出了一个对话框确定删除吗？这个为啥不谈了，他需求上我没没说。没说让你谈，当然从技术上来讲没什么，这个谈不谈无所谓了，对我们来说就是一行代码的事儿，知道吧，那那这个时候呢，你说老师他为什么这个地方不谈了，一般来讲这种情况下都不会谈。那因为以前删数据，为什他因为以前删的数据比较多，比较重要，什么重要，你看我们删市场活动的时候，再去看，你要我删市场活动的时候。我可以删多条一点删除。你要如果不谈的话，万一误删了呢，这些市场中全没了，因为没有了，再制造出来，在这儿创建每一条市场中这么多的数据，它在线，这些数据很难很难在线，但是这个备注就不一样了，我一次就删一个备注，而且这个备注就一个字段。

即使误伤了，也很容易在这个地方灸着么再现出来，所以一般来讲这种情况下一般都不疼，那有位老师谈下不更好吗？不更避免了这个这个误删吗？关键是这些备注有可能有很多条备注，如果有有很多备注都需要删，你每他每次点这确定删除话，点确定删了，确定删除话一点确定删除话一点确定就行了，如果是频繁的删除的话，每次都弹，用户还挺烦的知所以大家看像这些简单的数据一般来讲都不谈，但是我们说在实际开发的过程当中，到底谈还是不谈，我们说了不算。谁说了算呢？对需求说了算，客户说了算，他让你谈你就谈，他不让你谈你就不谈，当然我们说这种情况一般来讲都不会谈，所以我们这个地方了，我们也不知闹，我们也不谈了，知道吧，好，这是我们说这样，那大家看他一点删除按钮也别弹，确定删除吧，直接向后台发请求就行了，那像后台发请求，我们后台就提供CTRL来处理了，那这个ctrller师来看是不是还是我们上节课给大家讲那个remark controller啊，Control在里边加方法就行了，因为我们说了所有跟市场中备注相关的请求都交给remark control来处理，所以在这个地方，在这个activity remark control了，在这里边加个方法就行，来解决这个删除市场活动就来删除市场活动备注，他一点删除按钮，直接向他发请就行了。

啊发请过就行，然后呢大发请求，发一个删除请求，要删除备注了，删除请求那大家大家想一想，这个请求是同步的还是异步的，对异步的是不是也没有页面跳转啊，也没有异步请求，那异步请求大家需要提交什么参数，对，那你看CTRL需要什么，CTRL需要什么CRL干什么事，CTRL干什么事，CTRL你要删哪个备注，把这条备注删了。

那把这备注删了，备注表表有那么多条备注，你要删哪一个，得根据它的标标识去删，去删，所以把这条备注的标识ID传到过来就行，所以我们这个地方大家传一个ID，然后呢这个地方传ID，然后呢我们这个地方就可以了，然后呢，大概我们这个地方发一个向后台，只需要这个参数，只需要发这个参数就行。因为后台删除的备注只需要根你它就行，那这个CTRLL接到请时三个职责，第一个职责接收请求，有参数，收集参数，点收集参了叫获取参数，在页面上才收集的，怎么获取定义行参只有一个参数，不用重装了，第一个职责就完成了，下边第二个职责处理业务。

他处理业务就是处理数据干什么，根据ID把这条市场活动备注从表里边删了就行了。那当我们说control不能直接处理业务，它要调service，调谁的service，删市场活动备注，调市场活备注的service，所以我们这地方来一个activity叫remark service，嗯，然后呢，Remark service，然后呢，在这个市场活动备注的service里边加一个方法，这个方法就是根据ID去删除市场活动备注。其实大家这都是需求推动的，跟我说，然后呢，在这块加一个方法，删除得利索市长红备注activitymark，根据什么商ID商。方法，写括号，参数ID，知道吧，所以这都是设计好的推动，你不这么设计都不行，必须得这么设计，知道吧，按照规则必须这么设计这些代码，好，那这个service执行了之后，他就访问数据库，从市场活动备注表里把这条记录删了，当然他不能直接访问数据库。

他要调map，所以调用map删射红备注，肯定调社红备注的map，所以我们这地方来一个activity，叫mark map，然后呢，在这个map里边加一个方法，这个方法就根据ID去删除市场活动备注，然后呢这个东西删法，然后呢在这边也定一个方法，这个方法我就建明之意，建明之意那我是这了也直接设计了，然后呢叫delete activity remark remark，然后呢by ID，然后这里传来一个ID。然后在这个map里边就可以通过买八蒂去访问数据库，执行一个骚数据了。其实这个骚数机现在大家就能大概想象一下这个骚数据到底是个什么样色数剧，你知道吗？啊，当然是删除的操误，肯定是给例子懂，所以就这样吗？然后呢，这是执行操控局，然后呢就删除备注知道吧，知道那执行完了之后把执行结果往回发知道吧，那删除的四数据返回的结果是一个影响记录调控，然后影响记录调路继续往返返回给肯然后呢，这个地方还个。

然后呢，大概我们说这个CTRLL拿到影响记入条数，他的第二个职责就处理完了，数据已经处理好了，该删的数据都删掉了，那下边第三个第三个制作删成功了还是失败了，那要根据处理结果来生成个响应信息，所以这个地方呢，根据处理结果来生成响应信息，响应信息啊，然后把响应信息返回到前台就行了，那大家可以想象一下这个响应信息是个什么样的信息，嗯，然后呢，把它返回是这。

那这个响应信息达到什么信息，那从格式上来讲，看前面发请求，前面一步请求阿贾克斯响应给到阿贾克斯，阿贾克斯能解释数据，对杰森自串，杰森自传里边包含什么，你看前台需要什么，前台说了一点，它删除，删除成功了，把这个div删掉，删div好吧，它不是显示t div。显示div需要从后台返回数据，拼音删数据就不要这种参数了，是吧？再一个如果说一点删除，删除失败了，提示信息这个地方也不不用不用管了，所以总的而言，前台只需要知道后台删成功了还是失败了。所以我们就返回个成功和失败这个标记，一成零是吧，成功了无所谓了，只返回一个一就行了，失败了还要返回提示晶体，然后把这个message访问到前端，这样的话，我们整个访问到前端就这么一个阶层。

那这个接线访回到前台之后，那前台拿到之后解析杰森渲染页面啊，然后呢，这个地方大哥解析杰森，然后呢，渲染页面怎么解析接S转面，那就看零和一。如果是一，那就完了，把这个div从页面上删掉，怎么删，这都是大家我们具体语法的事儿了。那如果是失败了，体质仪他也不删了，所以这样的话呢，我们这个整个这个流程就设计好了。好，下边做什么呢？备注下面能查能添加了，还有什么，对，还有山河修改这里，现在下边我们准备做这了。修改和删除备注，先做哪个先做删除吧，删除稍微简单一点，我们的原则先做简单的，先挑简单的做，你别上来就啃一个是吧，硬骨头是吧，那这这做着做着是吧，做不下去了是吧，那以后到公司里边开发也是哪个你哪个简单，先把它解决掉啊。

然后呢，难的有的时候在解决简单的过程当中，难的也有思路这些，再一个我们说解决简单的过程有可能会降低难比较复杂的那些业务的难度，知道吧。所以说你别上来就做一个最复杂的一下做不下去了，这就不好了，还耽误时间是吧，所以我们下边准备来做这个什么删除的，这样删除备注，那删除备注它的，我们首先来看分析需求了。需求就这样，用户看到的某一个备注的时候，他说这个备注不想要了，那他就删了，删了怎么办？鼠标放到图标上，鼠标放到这条备注上了，那后边这个删除的图标就显示了，鼠标放到删除的图标上变红色，那用户一点这个删除的图标，这个时候就要向后台发请求了，把这条备注从数据库里边删，删了删完之后怎么办？那如果删除成功了，对刷新这个列表，刷的时候怎么刷？动态的刷就把这一条备注从页面上删掉就行了，别的没动的都不用动，保持不动。

你别到在方后台再查一遍，不查一遍删除谁就把这一个什么这条备注它对应的这个DA维从页面上删掉就行了。那么这是删除成功了，删除失败了提示信息，那这个地方也不用删了，不用刷新了，这大概他这个需求就这。好，下边对大家对这个需求有个大概了解之后呢，下面我们来看需求文档的描述，删除市场活度备注知道吧？好，下面我们一块来看看他这个假如用户在市场活动明细页面点击删除市场活动备注的图标。然后呢，完成删除市场活动备注的功能，他有特殊要求，他删除成功之后刷新备注列表。是吧，那这这个我们刚才说一样，删除失败提示你备注列表不刷新知道吧。好，大家我们这是他这个流程跟我刚才给大家介绍的基本上是一样的，我们不多说了，大家对这种需求有个明确的了解之后呢，下边我们一块来分析一下这个流程我们做的时候怎么去做的，好，下边我们来。