같은 장애 요소 <select>와 <input>나는 그들을 포장하기 위해 노력하고있어, 이벤트를 클릭 반응하지 않습니다 <div>과의 클릭 이벤트를 수신.
비활성화를 클릭하면 해당 <input>컨테이너에 대한 클릭이 트리거 <div>되지만 <select>요소에 문제가 있습니다. 이 JSFiddle 예제 에서 볼 수 있듯이 비활성화 된 <select>요소를 클릭 해도 컨테이너 <div>의 클릭이 트리거되지 않습니다 .
html :
<button onclick="buttonClick()" >Click</button>
<div id="test"></div>
js :
buttonClick = function (){
var editor = $("#test");
var div=$("<div>")
.mousedown(function () {
alert("!!!");
})
.appendTo(editor);
var selecttest = $("<select>")
.attr("disabled", "disabled")
.appendTo(div);
$("<option />").attr("value", '').appendTo(selecttest);
};
<input>대신 다음 코드를 사용 하여을 추가하면 <select>작동합니다.
var textinput = $("<input>")
.attr("type", "text")
.attr("disabled", "disabled")
.appendTo(div);
모두 : IE11의 경우 : 다른 브라우저에 대한 테스트 input와 select그것을 작동합니다.
파이어 폭스의 경우 : 모두 input와 select작동하지 않습니다.
Opera 및 Chrome : input작동 하기 때문에 작동 select하지 않습니다.
mousedown 이벤트는 비활성화 된 입력 또는 선택 요소 또는 비활성화 된 요소에 대한 마우스 이벤트에서 발생하지 않습니다. 여기에 귀하의 예가 있으며 입력 및 선택 요소를 모두 추가하고 클릭을 시도하면 경고가 발생하지 않습니다. 배경색을 빨간색으로 div를 만들었으므로 어디에 있는지 볼 수 있으므로 빨간색 부분 만 클릭하면 실행됩니다.
따라서 mousedown 이벤트가 비활성화 된 입력 필드에서 발생하지만 비활성화 된 선택에서는 발생하지 않는다는 진술은 false입니다 :)
var buttonClick = function() {
var editor = $("#test");
var div = $("<div>")
.mousedown(function() {
alert("!!!");
})
.appendTo(editor);
var textinput = $("<input>")
.attr("type", "text")
.attr("disabled", "disabled")
.appendTo(div);
var selecttest = $("<select>")
.attr("disabled", "disabled")
.appendTo(div);
$("<option />").attr("value", '').appendTo(selecttest);
};select {
width: 200px;
}
button {
width: 70px;
height: 21px;
}
#test div {
background: red;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<button onclick="buttonClick()">Click</button>
<div id="test"></div>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다