jQuery次のDivネストの入力フィールドの値を取得

Question

入力フィールドの値をクラス 'fullaccountcode'で次のdivにネストしようとしていますが、結果を警告すると空に戻ります。

HTML：

<div class="row"> 
        <div class="col-lg-1 col-md-1 col-sm-2 col-xs-2 fullaccountcode"> 
         <input type=text name=mcode[] id=mcode placeholder="34" class="form-control"> 
      </div> 
        <div class="col-xs-1 show-slash"> 
         <span>/</span> 
        </div> 
        <div class="col-lg-1 col-md-1 col-sm-2 col-xs-2 fullaccountcode"> 
         <input type=text name=ccode[] id=ccode placeholder="01" class="form-control" value="yello"> 
        </div> 
        <div class="col-xs-1 show-slash"> 
         <span>/</span> 
        </div> 
        <div class="col-lg-1 col-md-1 col-sm-2 col-xs-2 fullaccountcode"> 
         <input type=text name=sacode[] id=sacode placeholder="0016" class="form-control"> 
        </div> 
       </div> 

JS：

$(document).on("keyup","#mcode",function() { 
    alert($(this).closest('div').nextAll('.fullaccountcode').eq(0).val()); 
}); 

JSFiddle Demo

Answer 1

あなたのコード内の2つの問題があります

1）あなたがいるが、 divをターゲティングし、その中のinput要素はターゲティングしません。ターゲットdiv要素を取得した後に.find('input')を使用します。

2）また、eqセレクタは、ゼロインデックスに基づいて要素をターゲットにします。あなたはマッチしたセット内の最初の要素をターゲットにする:eq(0)または.first()を使用する必要があります。

$(document).on("keyup","#mcode",function() { 
    alert($(this).closest('div').nextAll(".fullaccountcode").eq(0).find('input').val()); 
}); 

Working Demo

Answer 2

あなたは$(this).parent().next().next().find("input").val()

$(document).on("keyup","#mcode",function() { 
 
    \t console.log($(this).parent().next().next().find("input").val()); 
 
    alert($(this).parent().next().next().find("input").val()); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="row"> 
 
\t \t \t \t \t \t <div class="col-lg-1 col-md-1 col-sm-2 col-xs-2 fullaccountcode"> 
 
\t \t \t \t \t \t \t <input type=text name=mcode[] id=mcode placeholder="34" class="form-control"> 
 
       </div> 
 
\t \t \t \t \t \t <div class="col-xs-1 show-slash"> 
 
\t \t \t \t \t \t \t <span>/</span> 
 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t <div class="col-lg-1 col-md-1 col-sm-2 col-xs-2 fullaccountcode"> 
 
\t \t \t \t \t \t \t <input type=text name=ccode[] id=ccode placeholder="01" class="form-control" value="yello"> 
 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t <div class="col-xs-1 show-slash"> 
 
\t \t \t \t \t \t \t <span>/</span> 
 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t <div class="col-lg-1 col-md-1 col-sm-2 col-xs-2 fullaccountcode"> 
 
\t \t \t \t \t \t \t <input type=text name=sacode[] id=sacode placeholder="0016" class="form-control"> 
 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t </div>