IE, Safari, Firefox의 동적 OnClick

다음 코드가 있습니다. 첫 번째 드롭 다운의 선택에 따라 두 번째 드롭 다운에 드롭 다운 옵션을 동적으로 추가하려고합니다. 둘 다 데이터베이스에서 데이터를 가져 오는 스크립트에 대한 Ajax 호출을 통해 생성됩니다. 다음은 관련 코드입니다. IE, Safari, Firefox의 동적 OnClick

function setSub(doc) { 
    // Setup some variables 
    var sNode = document.getElementById('4'); // GRAB THE ELEMENT HERE 
    var rmiData = doc.getElementById('rmiData').innerHTML; 
    var aItems = rmiData.split("|"); 
    var aVals; 
    // Set some background 
    sNode.style.background = "#fff"; 
    // Loop through adding options to the drop down 
    for (var x = 0; x < (aItems.length -1); x ++) { 
    aVals = aItems[x].split("="); 
    // ADD OPTIONS DYNAMICALLY TO SECOND DROP-DOWN HERE 
    sNode.options[x+1] = new Option(aVals[1],aVals[0],false,false); 
    // PROBLEM HERE: ADD ONCLICK TO THE OPTION WE JUST CREATED 
    sNode.options[x+1].onclick = function() { fixDayList(); }; 
    //sNode.options[x+1].onclick = new Function("fixDayList();"); 
    //sNode.options[x+1].setAttribute("onclick", "fixDayList();"); 
    // END PROBLEM LINES 
    } 
    // Set the length 
    sNode.length = x+1; 
    // Select the first item in the list 
    sNode[0].selected = true; 
}

당신이 "// 여기 문제"행 다음 섹션을 통지하는 경우

, 나는 세 가지 방법으로 onclick 이벤트를 추가하려고했습니다. Firefox에서는 3 가지가 모두 올바르게 작동합니다. IE6 또는 Safari에서 3 가지 작업 (IE8에는 잘 모르겠 음) 중 하나도 없습니다. 이것에 대한 제안? 나머지 코드는 기존의 레거시 코드에서 복사 한 구식 자바 스크립트를 사용하고 있으며, 내 버전에 (더 많은 코드를 다시 작성하지 않고) onclick을 추가하려고합니다.

onclick 이벤트가 Safari 및 IE에서 발생하지 않는 이유에 대한 의견이 있으십니까?

내 코드에서 jQuery에 액세스 할 수 있습니다. jQuery가 이것을 내부적으로 수정하면 사용할 적절한 선택기를 알아낼 수 있습니다. 그러나 정확하게 이것을 선택하는 방법을 모르겠습니다. 시도 :

$ ('# 4'). 옵션 [x + 1] .click (function() {fixDayList();});

하지만 선택기가 잘못되어 올바른 방법을 선택하는 방법이 명확하지 않습니다 (jQuery의 방식에서 녹색 임). 이 같은

출처

2010-02-10 Joel Dare

사용 무언가 :

if(window.addEventListener){ 
    sNode.options[x+1].addEventListener('click', fixDayList, false); 
} else if (window.attachEvent){ 
    sNode.options[x+1].attachEvent('onclick', fixDayList); 
} else { 
    sNode.options[x+1].onclick = fixDayList; 
}

업데이트 : 사파리에서

의 option 요소를 볼 수 있고 드롭 다운 목록으로 표시되지 않는 한, 그들은이 click 이벤트를 트리거하지 않습니다. 그러나 size=10 또는 무엇이든 select 요소에 추가하면 Safari는 option 요소에서 클릭 이벤트를 트리거합니다.

options에서 click을 사용하는 대신 요소에서 change 이벤트를 수신하는 것이 가장 좋습니다.

출처

2010-02-10 21:51:33

파이어 폭스에서도 작동했지만 (지금은 파이어 폭스에서 작동하는 4 가지 솔루션이 있습니다) IE 나 Safari에서는 작동하지 않습니다. –

@Joel, Safari는 드롭 다운으로 표시되는 옵션 요소에서'click' 이벤트를 트리거하지 않습니다. 나는 IE에 대해 잘 모르겠다. 그러나 나는 그것이 같은 것이라고 생각한다. 내 대답에 혼란스러워서 미안해,하지만 방금 테스트하고 그것이 어떻게 작동하는지 (사파리에서). 나는 나의 대답을 업데이트했다. –

귀하의 권리. 나는 잘못하고있다. 옵션의 "onClick"대신 드롭 다운의 "onChange"를 발생 시키도록 코드를 작성해야합니다. << 이마를 때 리다 >> –

IE, Safari, Firefox의 동적 OnClick

답변

관련 문제