2

I have functionality setup to execute whenever a select element changes its value. 它不使用正常的 onchange 事件，而是每 300 毫秒执行一次，并且仅在检测到更改的值时才调用处理程序。我正在使用原型Form.Element.Observer，如果这对您意味着什么。

现在，在 Firefox 中，当用户将鼠标悬停在 上option并触发定时值检查功能时，将调用处理程序，因为浏览器说值已更改。我想做的是能够检测到用户何时实际选择了该选项，而不是简单地将鼠标悬停在上面。我在原型文档中意识到，他们明确指出了这个错误（或功能，取决于你如何看待它），但我希望能够规范化行为。

在某种程度上，这有点类似于我之前在 StackOverflow 上看到的一个问题（检测 HTML 选择元素是否已展开（无需手动跟踪状态））但我希望那里的人能够告诉我该怎么做这仅适用于特定的选择元素，并且当它关闭而不是展开时。

为了更好地理解我的意思，请查看http://jsfiddle.net/KxQd6/，弄乱选择元素并查看控制台日志。

4

2 回答 2

2

这是一个示例，显示如何SELECT通过您提到的不同阶段控制元素更改：

（用户、dom-load 和 js 更新）

此代码利用event.simulate它提供了一种跨浏览器触发/模拟事件的方式。

代码（小提琴）

document.observe('dom:loaded', function() {
    var select = $('box_1'),
        button_1 = $('change_via_ajax'), 
        button_2 = $('change_via_script'), 
        results = $('results');

    // create observer on our select
    select.observe('change', function(e) {
        var d = new Date()
            t = d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds();
        results.insert(new Element('div')
               .update(t + ' - Change was fired, value is now [' + this.value + ']'));
    });

    button_1.observe('click', function() {
        new Ajax.Request('/echo/json/', {
            onComplete: function(j) {
                select.options[Math.round(Math.random() * 2)].selected = true;
                select.simulate('change');
            }
        });
    });

    button_2.observe('click', function() {
        select.options[0].selected = true;
        select.simulate('change');
    });
});​
于 2012-09-28T13:45:34.107 回答
0

查看https://github.com/harvesthq/chosen（尤其是https://github.com/harvesthq/chosen/blob/master/coffee/chosen.proto.coffee第 68-89 行）。无法确定 SELECT 元素的当前状态 - 只能通过一组鼠标、键盘和 UI 事件的事件观察器或多或少可靠地跟踪它。

于 2012-10-04T08:18:13.277 回答