Получите значение поля ввода «this» с помощью jQuery?

Question

Итак, у меня есть несколько div, содержащих ту же структуру HTML, имена классов и атрибуты. Они идентичны, за исключением содержимого, которое оно выводит. Каждый div имеет поле ввода внутри одного класса. Как получить конкретное значение каждого окна ввода? Я предполагаю, что я бы использовал «это», но я не могу понять, как точно использовать «это», чтобы получить конкретное значение каждого текстового поля. Я не хочу использовать каждый, потому что он выводит массив значений.

<div> 
    <input class="player-input" type="text"></input> 
    <button class="enter">Enter</button> 
    <p>Lorem Ipsum<p> 
</div> 

<div> 
    <input class="player-input" type="text"></input> 
    <button class="enter">Enter</button> 
    <p>Lorem Ipsum<p> 
</div> 

Я использую Meteorjs и события устанавливаются следующим образом:

Template.players.events({ 
    'click .enter': function(){ 
      //code 
    }, 
    'keydown .player-input': function(e){ 
     if (e.which == 13){ 
      //code 
     } 
    } 
}); 

Как мне получить значение каждого конкретного входного элемента с JQuery?

Answer 1

С текущей структурой, пред() должно работать:

http://api.jquery.com/prev/

$('button.enter').click(function() {  
    var myVal = $(this).prev('input.player-input').val(); 
}): 

Answer 2

Вот как я приложил каждый к пункту, дайте мне знать, если он работает: http://jsfiddle.net/VtMRx/

$(".player-input").each(function() { 
    //alert(this.value); 
    $("#paragraphID").append(this.value + "<br/>"); 
}); 

Answer 3

Вы можете использовать .closest

De scription: для каждого элемента в наборе получите первый элемент, который соответствует селектору, путем тестирования самого элемента и прохождения его предков в дереве DOM.

http://api.jquery.com/closest/

$('.enter').click(function() {  
    var myVal = $(this).closest('.player-input').val(); 
    $(this).closest('p').html(myVal); 
}):