2016-07-26 10 views
-1

選択tdの最初の子は私が選択TDをしたい

$(function() { 
 
      $("tr").click(function() { 
 

 
       $(this).addClass("selected"); 
 
      }); 
 

 
      //************** for left working***************// 
 
      $("button").click(function() { 
 

 
       var CurrentTrId = $("tr.selected").attr("data-id"); 
 

 
       var ParrentTrId = (CurrentTrId) - 1; 
 

 
       if (ParrentTrId == 0) { 
 
        return 
 
       } 
 

 
       var CurrentTrLeftValue = parseInt($(".selected > td:first-child ").css("padding-left")); 
 
       console.log(CurrentTrLeftValue); 
 
       var ParrentTrLeftValue = parseInt($("tr[data-id='" + parrentid + "']td:first-child").css("padding-left")); 
 
       if (NewCurrentTrLeftValue == ParrentTrLeftValue) { 
 

 
        if (CurrentTrLeftValue <= 40) { 
 

 
         CurrentTrLeftValue = (CurrentTrLeftValue + 20); 
 

 

 
         $(".selected > td:first-child").css({ "padding-left": CurrentTrLeftValue }); 
 
         $(".selected > td:first-child").addClass("normal"); 
 
         $('#', ParrentTrId).addClass('bold'); 
 
        } 
 
       }  }); 
 

 
     })
.table { 
 
    position:static; 
 
     width:100%; 
 
     border-collapse:collapse; 
 
     
 
     
 
} 
 
      .table td { 
 
       border: 1px solid; 
 
       border-color: lightgray; 
 
       
 
       height: 17px; 
 
      } 
 
      .selected{ 
 
       background-color:lightskyblue; 
 
      }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="table"> 
 
     <tr> 
 
     <td>hi</td> <td>hi</td> 
 
     </tr> 
 
     <tr> 
 
      <td>me</td> <td>me</td> 
 
     </tr> 
 
     <tr> 
 
      <td>you</td> <td>you</td> 
 
     </tr> 
 
    </table> 
 
    <button>clickme</button>

を取得されていませんこのための方法はありませんか? "parrentidはパラレントデータIDを格納する変数です"

テーブルとボタンがあります。選択可能なtrコンテンツを20 pxに移動するには、ボタンを最初にクリックしてください。 2回目のクリックで20pxをもう一度移動します(合計40px)。私は、この

$("tr[data-id='" + parrentid + "'] td:first-child"); 

を使用し、123px」のようなことを確認して

parseInt($("tr[data-id='" + parrentid + "'] > td:first-child").css("padding-left")); doesntのリターン文字列を作成していない場合は

$("tr[data-id='" + parrentid + "'] > td:first-child"); 

このセレクタが返すデータを確認してくださいここで

+0

あなたはstacksnippetで問題を再現することができますか...? –

+0

こんにちは私はここに完全なコードを追加します –

答えて

1

使用:first-child最初の子

var LeftValue = $("tr[data-id='1'] td:first-child").text(); 
alert(LeftValue) 

JSFIDDLE

1

をいくつかのコードを書きます'

-1

を選択するために、通常のエラー:jQueryライブラリは、HTMLページに含まれていないとき:「キャッチされないにReferenceError $が定義されていません」が発生します。 あなたはjQueryのファイルを含めるために、次のコードを使用して、試すことができます。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
関連する問題