分類信息模版，如果字段值為空則不顯示的代碼怎么寫

龍五

我通過分類信息設(shè)置了4個(gè)標(biāo)簽字段(選填)，需要如果標(biāo)簽字段值為空(不填)，則不顯示這個(gè)字段的標(biāo)簽。
在【帖子頁模版】我是這么寫的htm代碼：

1. <div class="infosItem_tags">

復(fù)制代碼

然后加了一段JS代碼：

1. <script>
   
2.     window.onload = function() {
   
3.         var test1="{bqian1_value}";
   
4.         if (test1.indexOf('無') >=0) {document.getElementById("bqian1").style.display = "none"; };
   
5.         var test2="{bqian2_value}";
   
6.         if (test2.indexOf('無') >=0) {document.getElementById("bqian2").style.display = "none"; };
   
7.         var test3="{bqian3_value}";
   
8.         if (test3.indexOf('無') >=0) {document.getElementById("bqian3").style.display = "none"; };
   
9.         var test4="{bqian4_value}";
   
10.         if (test4.indexOf('無') >=0) {document.getElementById("bqian4").style.display = "none"; };         
    
11.     }
    
12. </script>

復(fù)制代碼

通過以上代碼，在【帖子頁】實(shí)現(xiàn)了如果標(biāo)簽字段值為空(不填)，則不顯示這個(gè)字段的標(biāo)簽的效果。



但問題在于，將這htm和js代碼放到【列表頁模版】，列表頁卻沒有這個(gè)效果。



通過反復(fù)測試，發(fā)現(xiàn)列表頁如果只有一個(gè)帖子才有效果，我想應(yīng)該是列表頁模版不能照搬帖子頁的代碼，但不知道要如何修改，求大神指點(diǎn)應(yīng)該如何解決？

我知道答案 回答被采納將會(huì)獲得1 貢獻(xiàn) 已有4人回答

龍五

1. <div class="infosItem_tags">
   
2.                                         <i id="bqian1">{bqian1_value}</i>
   
3.                                         <i id="bqian2">{bqian2_value}</i>
   
4.                                         <i id="bqian3">{bqian3_value}</i>
   
5.                                         <i id="bqian4">{bqian4_value}</i>
   
6.                                 </div>

復(fù)制代碼

編輯帖子沒注意，htm代碼不完整就發(fā)出來了，給補(bǔ)上

龍五

想明白問題在哪了，帖子頁模板標(biāo)簽可以用固定id，而列表頁模板要用js為每一個(gè)標(biāo)簽生成一id，否則就會(huì)有沖突~~

龍五

分類信息-列表頁模板，修改后的htm代碼：

龍五

在分類信息列表頁模板，用帖子tid做標(biāo)簽字段id，并對(duì)不同標(biāo)簽加上a，b，c，d字符區(qū)分，修改后的htm代碼：

1. <div class="infosItem_tags">
   
2.         <i id="bqian_{tid}a">{bqian1_value}</i>
   
3.         <i id="bqian_{tid}b">{bqian2_value}</i>
   
4.         <i id="bqian_{tid}c">{bqian3_value}</i>
   
5.         <i id="bqian_{tid}d">{bqian4_value}</i>
   
6. </div>

復(fù)制代碼

對(duì)應(yīng)的js代碼：

1. <script>
   
2.     var test1="{bqian1_value}";
   
3.     if (test1.indexOf('無') >=0) {document.getElementById("bqian_{tid}a").style.display = "none";};
   
4.     var test2="{bqian2_value}";
   
5.     if (test2.indexOf('無') >=0) {document.getElementById("bqian_{tid}b").style.display = "none";};
   
6.     var test3="{bqian3_value}";
   
7.     if (test3.indexOf('無') >=0) {document.getElementById("bqian_{tid}c").style.display = "none";};
   
8.     var test4="{bqian4_value}";
   
9.     if (test4.indexOf('無') >=0) {document.getElementById("bqian_{tid}d").style.display = "none";};
   
10. </script>

復(fù)制代碼

完美解決：當(dāng)分類信息字段值為空或者不填(默認(rèn)值為"無")，當(dāng)前字段所屬的DIV或元素會(huì)自動(dòng)隱藏不顯示。