Question

很难用人类语言解释，只需显示代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang='zh-CN' xml:lang='zh-CN' xmlns='http://www.w3.org/1999/xhtml'>
<head>
    <script type="text/javascript">
        function call_f1(){
            document.getElementById('f1_div').click();

            // document.getElementById('f1_div').click();
        }

        function f1(){
            console.log('f1 '+new Date());               
            document.getElementById('btn_1').click();                
        }

    </script>
</head>
<body>
    <input id="btn_1" type="button" onclick="call_f1()" value="callf1"></input>
    <div id="f1_div"  onclick="f1()" style="background: red; width: 35px; height: 35px;">
    </div>
</body>

使用鼠标单击按钮时，控制台上会显示一个输出。为什么？？ f1函数不会重复调用吗？

Answer 1

http://www.w3.org/TR/html5/dom.html#run-synthetic-click-activation-steps 因此，为两个函数调用添加超时。如下所示。

    var timeout = 0; // change this to whatever suites for you
    function call_f1(){
        setTimeout(function(){
            document.getElementById('f1_div').click();
        }, timeout);

        // document.getElementById('f1_div').click();
    }

    function f1(){
        console.log('f1 '+new Date());               
        setTimeout(function() {
            document.getElementById('btn_1').click();
        }, timeout);                
    }

Answer 2

尝试：

   function call_f1(){
        document.getElementById('f1_div').onclick();

        // document.getElementById('f1_div').onclick();
    }

    function f1(){
        console.log('f1 '+new Date());               
        document.getElementById('btn_1').onclick();                
    }

这个适合我：http://jsfiddle.net/djhell/rG782/

Answer 3

为什么？ f1函数不会重复调用吗？

没有。 .click()及其启动的synthetic click activation在该元素已有活跃'click'事件时将无法执行任何操作。

如果元素的点击进行中标志设置为true，则中止这些步骤。



将元素上的单击进行中标志设置为true。

如果您希望它与.click()连续，您必须先允许先前的事件结束。可能使用计时器：

function f1(){
    console.log('f1 '+new Date());

    setTimeout(function () {
        document.getElementById('btn_1').click();
    }, 1);
}

无法反复点击对方

3 个答案: