HTML 양식을 생성하고 사용자 입력을 리턴하는 JavaScript 함수

Question

HTML 양식을 작성하고 사용자가 양식에 입력 한 JavaScript 함수를 작성하려고합니다. 내 바보 같은 첫 번째 시도는이 같은했다 :

function getInput() { 
    $('#somediv').html("<input type='button' id='mybutton' name='Click Me'></input>"); 
    $('#mybutton').click(function() { return "result"; }); 
} 

result = getInput(); 

alert(result); 

(실제 상황은 사용자가 처음 텍스트를 입력 한 후 여러 가지 버튼 사이에서 선택해야하고, 더 복잡하고, 반환 값이 입력 한 텍스트에 따라 달라집니다 선택한 버튼,하지만 그 주변 문제는 그래서 그들을 버렸다고 생각). 서면으로 이걸 실행하면 경고 "결과"가 원하는 곳에 "정의되지 않은"경고를 받게됩니다. 필자는 함수가 명시 적으로 그렇게 할 때까지 반환하지 않기를 바란다. 이것을 달성 할 수있는 방법이 있습니까? 그렇지 않다면 위의 정신과 비슷한 가장 간단한 해결 방법은 무엇일까요?

매우 비슷한 질문이 여기에 제기되었습니다. JavaScript pausing execution of function to wait for user input. 나는 단지 반응을 내 특별한 경우에 적용 할만큼 충분히 이해하지 못했을 까봐 걱정된다. 아마도 누군가가 그렇게하는 방법을 조언 할 수도 있고, 처음부터 다시 시작할 수도 있습니다.

Answer 1

사용자 입력을 기다리는 것은 불가능합니다. 비동기 요청을 처리하려면 두 부분으로 나누어야합니다.

function getInput(callback) { 
    $('#somediv').html("<input type='button' id='mybutton' name='Click Me'></input>"); 
    $('#mybutton').click(function() { callback("result"); }); 
} 

function processInput (result) { 
    alert(result); 
} 

getInput(processInput); 

Answer 2

나는 무엇을 당신이 찾고있는 것은 이벤트 위임을 사용하여, 이벤트 위임을 생각 할 수 있습니다 바인드에 함수 당신의 #mybutton 당신의 버튼도 양식에 추가되기 전에. .on()

$(document).on('click', '#mybutton', function() { 
    //your code here 
}); 

이벤트 위임의 기본 개념은 자바 스크립트 이벤트 거품까지에, 그래서 당신이하는 일에 높은 요소에 이벤트를 바인딩된다는 사실을 활용하는 사용 예를 들어

DOM을 확인한 다음 해당 이벤트의 출처를 확인하십시오. 이벤트를 바인딩 할 때 상위 수준이 존재하는 한 확인하십시오.