Question

请仔细阅读标题 - 这不是常见的事情。

网页上存在一个选择框。可以通过javascript，外部 js以编程方式更改其selectedIndex的选择框。

我希望在索引更改时收到通知（crossbrowser解决方案）。这可能吗？

或HTML：

<select id="mySelect">
    <option>opt 1</option>
    <option>opt 2</option>
    <option>opt 3</option>
</select>

JavaScript的：

// Code I cannot manipulate
var select = document.getElementById("mySelect");
select.selectedIndex = 2; // I would like to be notified now

等待您的见解： - ）

更新

这不能回答我原来的问题，但是使用这个我设法完成了我最初的想法（不是帖子的一部分）：

select.selectedIndex = 2;
select.onchange();

Answer 1

Javascript更改事件需要用户启动的浏览器事件。当JavaScript本身触发更改时，它们不起作用。

如果您真的非常想要这样做，您应该编写一个函数，使用<select>定期轮询setInterval的值，然后进行比较。

var selectold =  select.selectedIndex;
setInterval(function(){
    if(selectold != select.selectedIndex)
       {
           console.log("there was a change");
           selectold = select.selectedIndex;

       }
},500);

已编辑Fiddle

Answer 2

我意识到我间接触发了选择框的更改。这使我能够在那之后做一个检查..不仅仅是听众，但它会工作，不会那么脏： - ）

至少我确认没有这样的事件要听。谢谢你。

Answer 3

如果您控制正在更新selectedIndex的代码，您可以向其中注入回调，这将为您提供类似行为的事件。

/* code that I do not wish/'cannot' change: */
function startSelectScroll(indexChangeCallback) {
    var select = document.getElementById("mySelect");

    var index = 0;
    var myInterval = setInterval( function() { // Change index every 500ms

        index++;
        select.selectedIndex = index % 3;

        indexChangeCallback.call(select);
    }, 500 );

    setTimeout( function() { // Remove automatic change after 3000ms
        clearInterval( myInterval );
        alert(callCount);
    }, 3000 );
}
/* end unmodifiable code */

startSelectScroll(function() {
    callCount++;
});

var callCount = 0;

如果你不控制它，你使用的框架应该以相同的方式支持回调。

Answer 4

首先我想到的是;

function alertMe(theSelect) {
    var mySelectList = document.getElementById(theSelect);  
    var result = mySelectList.options[mySelectList.selectedIndex].value;
    alert(result); // Alerts selected option
}

HTML：

<select id="mySelect" onchange="javascript:alertMe("mySelect")">
    <option value="A"> A text </option>
    <option value="B"> B text </option>
    <option value="C"> C text </option>
<select>

这给出了所选的选项值字段，您也可以获得文本字段，并在末尾用“.text”替换“.value”..

Selectbox：抓住外部JavaScript TRIGGERED的onchange事件？

4 个答案: