Javascript：如果標籤裏面爲空，如何隱藏div

如果裏面的標籤沒有任何顯示內容，我想隱藏class =「form-group」的div 這裏是我的html代碼：Javascript：如果標籤裏面爲空，如何隱藏div

echo'<div class="form-group">'; 
         echo'<label for="exampleInputFile" class="tbh">'.$query2['req_1'].'</label>'; 
         echo'<input type="file" name="my_image" accept="image/*" id="exampleInputFile"> '; 
         echo'</div>';

而且我的JavaScript是在這裏：

<script type="text/javascript"> 
         if($('label.tbh:empty')){ 
          $('div.form-group').hide(); 
         } 
         </script>

是否有任何其他方式做到這一點？在我的代碼中，它似乎不起作用。在此先感謝您的幫助。

來源

2016-09-25 user

所有答案不僅對我有用，對觀衆也有用。 +1給所有回答的人。我很感激你的幫助。 – user

如果你使用jQuery，您可以通過這種方式做到這一點：

$("div.form-group label.tbh:empty").parent().hide();

這裏面document.ready回調做一個正確的方法：

$(document).ready(function(){ 
    $("div.form-group label.tbh:empty").parent().hide() 
});

要包含jQuery，請添加

echo '<script src="https://code.jquery.com/jquery-3.1.1.js"></script>';

您的腳本的頭。

但似乎你在後端使用PHP或類似的東西？在這種情況下，你不會不必要的數據傳輸到客戶端

if(strlen($query2['req_1']) == 0) 
{ 
    echo'<div class="form-group">'; 
    echo'<label for="exampleInputFile" class="tbh">'.$query2["req_1"].'</label>'; 
    echo'<input type="file" name="my_image" accept="image/*" id="exampleInputFile"> '; 
    echo'</div>'; 
}

：如果是這樣，你可以做它像這樣的服務器端代碼。

來源

2016-09-25 14:04:22 MobDev

感謝@MobDev jQuery完美運作。而PHP也是如此，但PHP非常棘手。這真的幫了很多人感謝。 – user

很高興幫助你:) – MobDev

試試這個：

if($('label.tbh').html() == ""){ 
    $('div.form-group').hide(); 
    }

來源

2016-09-25 13:54:46

我給出了一個控制檯錯誤它說：Uncaught ReferrenceError：$未定義 – user

嘗試jQuery現在$現在如果你有jQuery沒有定義，然後檢查正確版本的jquery是否加載？ –

U可以做到這一點是這樣的：

/* Be sure that ur dom is loaded */  
$(document).ready(function() { 
    /* Checking that the label is empty */ 
    if($("label").html().length == 0) { 
     $('div.form-group').hide(); 
    } 
});

ü也可以用它代替長度尺寸（）;）

來源

2016-09-25 14:00:24 Latsuj

使用.text()是更安全的選擇。如果標籤爲空，則.text()將返回一個空字符串，否定將給出true。請參閱下面的示例中的交互式片段。我將相關的代碼放在一個按鈕點擊處理程序中，以證明它在您點擊它後可以正常工作。

$('button').click(function() { 
 
    if (!$('.tbh').text()){ 
 
    $('.form-group').hide(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="form-group"> 
 
<label for="exampleInputFile" class="tbh"></label> 
 
<input type="file" name="my_image" accept="image/*" id="exampleInputFile"></div> 
 

 
<button>Click to hide</button>

來源

2016-09-25 14:02:23

感謝它的工作原理，但是如果我想在不需要按鈕的情況下自動隱藏它，該怎麼辦。 – user

我把它放在一個按鈕中，以證明它在你點擊它的例子後有效。你可以簡單地使用你的用例的按鈕功能中的代碼。 –

謝謝你，我要和它一起玩。 +1您的回答對觀衆有用。 – user

Javascript：如果標籤裏面爲空，如何隱藏div

回答

相關問題