Question

如何通过Google Chrome（Windows 7 64位上的9.0.597.98）启动表单的onchange？如果你玩下面的例子，没有任何东西可以安慰。它在Firefox 3.6.13中运行良好。

<form onchange="console.info('form changed')">
 <select>
  <option>uno</option>
  <option>dos</option>
 </select>
 <input type="radio" name="videoDevice" value="tres" checked="checked" />
 <input type="radio" name="videoDevice" value="cuatro" checked="checked" />
</form>

Answer 1

通过JS绑定change事件似乎没问题：

<强> HTML

<form id="test">
 <select>
  <option>uno</option>
  <option>dos</option>
 </select>
 <input type="radio" name="videoDevice" value="tres" checked="checked" />
 <input type="radio" name="videoDevice" value="cuatro" checked="checked" />
</form>

<强> JS

document.getElementById('test').addEventListener('change', function() {
    alert('change fired');
}, false);

Answer 2

基本上，表单只有以下两个事件：onreset，onsubmit。你可以做一个解决方法：

window.onload=(function ()
{
    var Form=
    {
        w3c: !!window.addEventListener,
        addEvent: function (form,type,listener)
        {
            var inputs=form.elements;
            for (var i=0,l=inputs.length; i<l; ++i)
            {
                var input=inputs[i];
                if (this.w3c)
                {
                    input.addEventListener(type,listener,false);
                }
                else
                {
                    input.attachEvent("on"+type,listener);
                }
            }
        },
        fixEvents: function (form)
        {
            var eventPattern=/^on(\w+)$/;
            var attribute;
            for (var i=0,l=form.attributes.length; i<l; ++i)
            {
                var attribute=form.attributes.item(i);
                var name=attribute.name;
                var value=attribute.value;
                if (eventPattern.test(name) && !form[name])
                {
                    var type=eventPattern.exec(name)[1];
                    var listener=new Function(value);
                    this.addEvent(form,type,listener);
                }
            }
        }
    };

    return function ()
    {
        var forms=document.getElementsByTagName("form");
        for (var i=0,l=forms.length; i<l; ++i)
        {
            Form.fixEvents(forms[i]);
        }
    };
})();

Answer 3

     var button = document.form.adet;
        if (button.addEventListener) {  // all browsers except IE before version 9
            button.addEventListener ("change", function () { alert('1'); }, false);
        }
        else {
            if (button.attachEvent) {   // IE before version 9
                button.attachEvent ("onchange", function () { alert('2'); });
            }
        }

Google Chrome表单onChange未触发

3 个答案: