onchange 이벤트 바로 다음에 onclick 이벤트를 감지 할 수 있습니까?

<!DOCTYPE html> <!-- HTML5 --> 
<html> 
<head> 
<meta charset="UTF-8"> 
</head> 

<body> 
<p><button type="button" onclick="show()">Show new name</button></p> 
<p>Name: <input type="text" onchange="changed()" id ="nm" name="FirstName" value="Mickey"></p> 
<p>New name: <span id="sh" ></span></p> 

<script> 
function show() 
{ 
    var elem = document.getElementById("nm"); 
    name = elem.value; 
    document.getElementById("sh").innerHTML = name; 
} 
function changed() 
{ 
    alert("Name changed"); 
} 
</script> 
</body> 
</html>

사용자가 새 이름을 입력하고 포커스를 변경 한 다음 버튼을 클릭하면 새 이름이 의도 한대로 표시됩니다. 그러나 사용자가 이름을 변경하고 포커스를 변경하지 않고 단추를 클릭하면 새 이름이 표시되지 않습니다. 이유가 무엇인가요? 내 코드에는 여러 개의 입력이 있으며 변경된 시점에 각각을 처리하고 버튼을 클릭 할 때 더 많은 작업을 수행하려고합니다. 문제는 사용자가 처음 직관적이지 않은 마우스 클릭을하거나 "enter"를 누르지 않으면 버튼 클릭이 인식되지 않는다는 것입니다. 원하는 동작을 얻을 수있는 방법이 있습니까?onchange 이벤트 바로 다음에 onclick 이벤트를 감지 할 수 있습니까?

출처

2013-11-23 user2662157

귀하의 html : onclick, onchange에서 인라인 자바 스크립트를 사용하지 마십시오. 그것은 결코 좋은 연습이 아니 었습니다. – m59

@ m59 이해합니다. 여기 내 목적은 가능한 한 단순한 방식으로 이슈를 구성하는 것이 었습니다. – user2662157

나는 당신이 원하는 것을 정확히 얻지 못합니다. 그냥, 초점은 여전히 입력에있는있는 버튼을 클릭 한 후 이름을 변경하려는 경우 M59이 명시된 바와 같이하지만 단지) (보여

<p><button type="button" onclick="show()">Show new name</button></p> 
<p>Name: <input type="text" onchange="show()" id ="nm" name="FirstName" value="Mickey"></p> 
<p>New name: <span id="sh" ></span></p>

example Fiddle

당신의 "onchange를"기능을 변경하고 인라인 JavaScript는 결코 좋은 습관이 아닙니다.

출처

2013-11-23 18:29:08 Sebsemillia

매번 "show()"를 호출하지 않고 여러 입력을 변경하고 마지막 입력을 입력 한 후 사용자가 버튼을 클릭 할 때 "show()"를 호출 할 수 있기를 원합니다. 마우스를 클릭하거나 버튼을 클릭하기 전에 초점을 잃기 위해 "엔터"를 누르십시오. – user2662157

onchange 이벤트는 요소의 값이 변경되고 사용자가 요소를 클릭 할 때 onclick 이벤트가 발생할 때 발생합니다.

난 당신이 onblur event.Try이를 사용하는 것이 좋습니다 :

<p>Name: <input type="text" onblur="changed()" id ="nm" name="FirstName" value="Mickey"></p>

객체가 포커스를 잃었을 때에 onblur 이벤트가 발생합니다. 여기

확인 : 여기 Demo

출처

2013-11-23 18:29:18

귀하의 문제는 경고입니다.

요소에서 하나의 마우스 클릭과 마우스 업이 감지되면 클릭 이벤트가 발생합니다.

버튼을 누르면 mousedown이 실행되고 입력이 흐려져 onchange 이벤트가 트리거됩니다. 그러나 앞에 와서 (커서와 버튼 사이에 마우스를 올리면 결코 버튼이나 onclick에서 실행되지 않습니다) 경고가 추가됩니다.

이 경고를 제거 (그리고 모두가 잘 작동됩니다)
는 버튼을하면 onMouseDown 등록 및하지의 onclick :
은 당신이 할 수있는이 문제를 방지하려면.

출처

2013-11-23 18:45:18 Kustolovic

"onclick이 아닌 onmickedown을 등록하십시오" – user2662157

"onclousedown을 onclick이 아닌 버튼에 등록하십시오."이것은 훌륭합니다. . 감사. – user2662157

onchange 이벤트 바로 다음에 onclick 이벤트를 감지 할 수 있습니까?

답변

관련 문제