记录一次实现且或逻辑关系功能

最新推荐文章于 2022-09-16 17:24:37 发布

方糖公子

最新推荐文章于 2022-09-16 17:24:37 发布

阅读量688

点赞数

分类专栏： js 文章标签： css js

本文链接：https://blog.csdn.net/qq_33440352/article/details/83505788

版权

js 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

原本是个很复杂得且或逻辑关系运算，可实现且或多层逻辑功能，经过产品沟通目前仅需实现，组间或，组内且得逻辑关系，功能效果图如下：

作为开发人员时刻谨记不能盲目开发，接到需求功能首先想到这个功能有什么意义，怎么去实现，难点儿在哪里？

这个功能主要是为了实现资质得可配化逻辑，纯js、css技术，难点儿在于怎么分割存入数据库，

1.css如下:

2.html如下:

   <table class="sag_edit_table">
       <tr>
           <td id="zz">
               <c:if test="${empty expressionEXC}">
                   <ul class="and">
                       <li>
                           <select name="goodsCateQualificationVO.qualifications" required="true">
                               <option value="-1">----请选择----</option>
                               <c:forEach items="${qualificationTypeList}" var="qualificationVO" varStatus="sta">
                                   <option value="${qualificationVO.qualificationCode}">${qualificationVO.qualificationName}</option>
                               </c:forEach>
                           </select>
                           <a class="del_btn" οnclick="deleteItem(this);">删除本组</a>
                           <a id="and_btn" οnclick="addAnd(this)">且关系创建</a>
                       </li>
                   </ul>
               </c:if>
               <ul class="or">
                   <li>
                       <br>
                       <a id="or_btn" οnclick="addOr();">或关系创建</a>
                   </li>
               </ul>
           </td>
       </tr>
   </table>

3.1.增加组内且逻辑：

3.2.增加组间逻辑：

4.删除逻辑：

5.组能更改，并限制组内相同，组间相同：

       $(document).on('change','select[name="goodsCateQualificationVO.qualifications"]',function(){
           //组内检查
           var selectVal=$(this).val();
           var selectObj=$(this);
           var selectList=new Array();
           $(this).parent().parent().find('li>select[name="goodsCateQualificationVO.qualifications"]').each(function(){
               if($(this).val()!='-1')
                   selectList.push($(this).val());
               $(this).find('option').css('display','');
           });
           $(this).parent().parent().find('li>select[name="goodsCateQualificationVO.qualifications"]').each(function(){
               var thisSelectVal=$(this).val();
                   for(var i=0;i<selectList.length;i++){
                       if(thisSelectVal!=selectList[i])
                           $(this).find('option[value="'+selectList[i]+'"]').css('display','none');
                   }

           });
           //组间检查
           var thisAnd=$(this).parent().parent();
           $('#zz').find('.and').not(thisAnd).each(function(){
               var thisList=new Array();
               $(this).find('li>select[name="goodsCateQualificationVO.qualifications"]').each(function(){
                   if($(this).val()!='-1')
                       thisList.push($(this).val());
               });
               if(equalsArray(selectList,thisList)){
                   sagalert('提示','重复组资质！请重新选择！',function(){
                       selectObj.val('-1');
                   });
               }
           });
       });

//判断两组数据是否相同

6.保存功能：

方糖公子

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
记录一次实现且或逻辑关系功能

原本是个很复杂得且或逻辑关系运算，可实现且或多层逻辑功能，经过产品沟通目前仅需实现，组间或，组内且得逻辑关系，功能效果图如下：作为开发人员时刻谨记不能盲目开发，接到需求功能首先想到这个功能有什么意义，怎么去实现，难点儿在哪里？这个功能主要是为了实现资质得可配化逻辑，纯js、css技术，难点儿在于怎么分割存入数据库，1.css如下: &lt;style type="text...
复制链接

扫一扫

专栏目录