2016-06-02 8 views
1

私はテーブルを持っており、第四TD上のユーザfocusoutが6日、TDは、例えば代わり​​にTD 5.テーブルにカスタムセルをフォーカスする方法は?

var rowindex=$("#mycustomizedtable).attr('rowselected); 
 
    
 
    var row=$("#mycustomizedtable tbody).find('tr')[rowindex]; 
 

 
    var tds=$(row).find('td'); 
 

 
    var colselected=$("#mycustomizedtable).attr('colselected'); 
 
        
 
    
 
    console.log(colselected);   

の焦点取得するときrowSelectedは、私がしたい:私は結果を得る '4' にコンソール

今、私は6tdフォーカスを取得します。

私はこれを書いていますが、正解はありません。

if(colselected==4) 
 
    { 
 
    $(row).find('td').eq(6).focus(); 
 
    }

は、どのようにそれを行うことができますか?

+0

は、各 '​​は' 'の vijayP

+0

@vijayPはい、そうです。 –

+0

htmlを追加できますか? 6番目の 'td'を取得したい場合は、インデックスが' 0'で始まるので 'eq(5)'を使います。 – RRK

答えて

1

ヘルプのコードは次のとおりです。ここでは、<table>要素内に存在するすべてのinput要素に、focusoutリスナーを追加しました。第4セルinputからfocusoutが起きているかどうかを確認します。そしてそこから起こっている場合は、第6セルのinputボックスに集中するように強制しています。あなたの目標を達成するためにあなたを導くことを願っています。

$(document).ready(function(){ 
 
    $("#mycustomizedtable td input").focusout(function(){ 
 
    var currentElem = $(this); 
 
    var currentIndex = currentElem.closest("td").index(); 
 
    if(currentIndex == 3) 
 
     currentElem.closest("tr").find(":nth-child(6)").find("input").focus(); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<table id="mycustomizedtable"> 
 
    <thead> 
 
    <th>First</th> 
 
    <th>Second</th> 
 
    <th>Third</th> 
 
    <th>Fourth</th> 
 
    <th>Fifth</th> 
 
    <th>Sixth</th> 
 
    <th>Seventh</th> 
 
</thead> 
 
<tbody> 
 
    <tr> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text" value="5th value"/></td> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text"/></td> 
 
    </tr> 
 
    <tr> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text" value="5th value"/></td> 
 
    <td><input type="text"/></td> 
 
    <td><input type="text"/></td> 
 
    </tr> 
 
</tbody> 
 
</table>

関連する問題