Kodları lütfen aşağıdaki butonları kullanarak renklendirin. Örnek: <php> echo "Selam Dünya"; </php>
Yardım
karakter kaldı

javascript ile tablonun istediğim satırlarını gizlemek göstermek

<table border="1">
<tr id="tr1">
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr id="tr2">
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr id="tr3">
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr id="tr4">
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr id="tr5">
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

<label>
<input type="submit" name="button" id="button" value="G&ouml;ster" />
</label>
<input type="submit" name="button2" id="button2" value="Gizle" />

yapmak istediğim ;
gizle butonuna bastığımda istediğim satırları (mesela tr1 tr3 ve tr4)gizlemek
göstere basınca da tüm satırları göstermek
+0
-0
Cevaba KatılıyorumKatılmıyorum
Cevap Yaz Yorum Yaz Arşivime Ekle Takip Et

Doğru Cevap

  • huseyiniskender adlı üyenin fotoğrafı
    10 yıl önce yazılmış
    47 cevap - 20 soru
    Merhaba İstediğiniz durumu yapan bir örnek hazırladım, fonksiyonu çağırırken id'ler arasına virgül koyarak çoklu işlem yapabilirsiniz. Kolay gelsin.


    <script type="text/javascript" language="javascript">
    function goster(id){
    var dizi=id.split(",");
    for( var i =0; i <dizi.length; i++) {
    document.getElementById(dizi[i]).style.display='';
    }
    }
    
    function gizle(id){
    var dizi=id.split(",");
    for( var i =0; i <dizi.length; i++) {
    document.getElementById(dizi[i]).style.display='none';
    }
    }
    </script>
    <table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr id="tr1">
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    </tr>
    <tr id="tr2">
    <td width="100" bgcolor="#666666"> </td>
    <td width="100" bgcolor="#666666"> </td>
    <td width="100" bgcolor="#666666"> </td>
    <td width="100" bgcolor="#666666"> </td>
    <td width="100" bgcolor="#666666"> </td>
    </tr>
    <tr id="tr3">
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    </tr>
    <tr id="tr4">
    <td width="100" bgcolor="#666666"> </td>
    <td width="100" bgcolor="#666666"> </td>
    <td width="100" bgcolor="#666666"> </td>
    <td width="100" bgcolor="#666666"> </td>
    <td width="100" bgcolor="#666666"> </td>
    </tr>
    <tr id="tr5">
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    <td width="100" bgcolor="#333333"> </td>
    </tr>
    </table>
    
    <label>
    <input type="submit" name="button" id="button" value="Göster" onclick="goster('tr1,tr2')" />
    </label>
    <input type="submit" name="button2" id="button2" value="Gizle" onclick="gizle('tr1,tr2')" /> 
    
    • huseyiniskender adlı üyenin fotoğrafı huseyiniskender
      Kodları direk kopyalayıp çalıştırırsanız tablo görünmeyebilir bu yüzden öncesinde td aralarındaki boşluklara örneğin a gibi örnek değerler girin Aşağıdaki gibi


      <script type="text/javascript" language="javascript">
      function goster(id){
      var dizi=id.split(",");
      for( var i =0; i <dizi.length; i++) {
      document.getElementById(dizi[i]).style.display='';
      }
      }
      
      function gizle(id){
      var dizi=id.split(",");
      for( var i =0; i <dizi.length; i++) {
      document.getElementById(dizi[i]).style.display='none';
      }
      }
      </script>
      <table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr id="tr1">
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      </tr>
      <tr id="tr2">
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      </tr>
      <tr id="tr3">
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      </tr>
      <tr id="tr4">
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      </tr>
      <tr id="tr5">
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      </tr>
      </table>
      
      
      <input type="submit" name="button" id="button" value="Göster" onclick="goster('tr1,tr2')" />
      <input type="submit" name="button2" id="button2" value="Gizle" onclick="gizle('tr1,tr2')" /> 
      
      10 yıl önce yazılmış
    • imeilim adlı üyenin fotoğrafı imeilim
      harikasınız çok teşekkürler....
      10 yıl önce yazılmış
    • huseyiniskender adlı üyenin fotoğrafı huseyiniskender
      Rica ederim, iyi çalışmalar.
      10 yıl önce yazılmış
    • NooBisH adlı üyenin fotoğrafı NooBisH
      Benim bir sorum olacak; acaba bundaki göster gizle tuşlarını tek bir tuş yapabilirmiyiz? Yani göstere basınca gizle olsun gizleye basıncada göster. Teşekürler
      10 yıl önce yazılmış
    • huseyiniskender adlı üyenin fotoğrafı huseyiniskender
      Merhaba sanırım istediğiniz belirtilen td gizli değilse gizlensin, gizliyle görünsün. Bu durumu sağlayan kodu aşağıya yazıyorum. Fonskiyona virgül ile ayırarak birden fazla id gönderilebilir.


      <script type="text/javascript" language="javascript">
      function gizle_goster(id){
      var dizi=id.split(",");
      for( var i =0; i <dizi.length; i++) {
      	if(document.getElementById(dizi[i]).style.display==''){ document.getElementById(dizi[i]).style.display='none'; }
      	else if(document.getElementById(dizi[i]).style.display=='none'){ document.getElementById(dizi[i]).style.display=''; }
      }
      }
      </script>
      <table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr id="tr1">
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      </tr>
      <tr id="tr2">
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      </tr>
      <tr id="tr3">
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      </tr>
      <tr id="tr4">
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      <td width="100" bgcolor="#666666">a</td>
      </tr>
      <tr id="tr5">
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      <td width="100" bgcolor="#333333">a</td>
      </tr>
      </table>
      
      
      <input type="submit" name="button" id="button" value="Gizle / Göster" onclick="gizle_goster('tr1')" />
      
      10 yıl önce yazılmış
    • NooBisH adlı üyenin fotoğrafı NooBisH
      Çok teşekkür ederim. Peki bu gizlenme ve gözükmeya efekt yapabilir miyiz? Mesela sislenerek ve küçülerek yok olsa?
      10 yıl önce yazılmış

Cevaplar

  • 1
    ziyahan adlı üyenin fotoğrafı
    10 yıl önce yazılmış
    29 cevap - 2 soru
    Gizlemek için:
    $("table tr[id='tr1']").css("display","none");
    



    Göstermek için:
    $("table tr[id='tr1']").css("display","");
    
    • imeilim adlı üyenin fotoğrafı imeilim
      bu yazdığınız ajax galiba ben javascript demiştim
      Neyse böyle de olur ama tamamını yazarmısınız kodları nasıl yazmam lazım bir de siz tr1 demişsiniz birden fazla tr yazmak istediğimiz zaman aralarına virgül koyarak mı yazacağız
      10 yıl önce yazılmış
    • NooBisH adlı üyenin fotoğrafı NooBisH
      bu kodları tam olarak nasıl kullanıyoruz?
      10 yıl önce yazılmış