jQuery. 버튼 클릭 이벤트에서 텍스트 입력 필드 값 가져 오기?

Question

HTML :

<div id="search"> 
    <input id="term" type="text" value="enter your search" /> 
    <button id="hit" type="button" name="">Search</button> 
</div> 

jQuery를이 :

$(document).ready(function() { 
    var term = $('#term').val(); 
    $('#hit').click(function() { 
    alert(term); 
    }); 
}); 

문제는 다음 버튼을 눌러 상관없이 내가 입력 필드에 입력 한 내용, 즉, 항상 "입니다 원래의 입력 값을 경고 당신의 수색을 입력하십시오 ".

어떻게 해결할 수 있습니까?

Answer 1

이 전체 코드 블록은 DOM 준비 이벤트에서 실행됩니다.

var term = $('#term').val();은 한 번만 평가되고 용어 변수에 '검색 입력'이 저장됩니다. 따라서 값을 변경하는 것과 관계없이 변수는 페이지가 렌더링 될 때 여전히 초기 값을 유지합니다.

대신에 당신이 할 일은 더 다음과 같은 것입니다 : 코드의이 비트에

JQuery와

$(document).ready(function() { 
    $('#hit').click(function() { 
    alert($('#term').val()); 
    }); 
}); 

, 아이디 용어를 가진 요소의 값이 평가 될 때 클릭 이벤트 리스너 화재 .

Answer 2

당신은 오히려 문서가 준비 만 할 때 변수를 생성하기 때문에 .. 가 클릭 기능 내부 변수 "용어를"만들려고 document ready

$(document).ready(function() { 
    $('#hit').click(function() { 
    var term = $('#term').val(); 
    alert(term); 
    }); 
}); 

Answer 3

보다 click에 값을 얻을 필요가있다. ..

$(document).ready(function() { 
     $('#hit').click(function(event) { 
      var term = $('#term').val(); 
      alert(term); 
     }); 
    });​