鍍金池/ 問(wèn)答/HTML/ 在jsp頁(yè)面上,點(diǎn)擊生成相應(yīng)的一個(gè)<div>(這個(gè)已實(shí)現(xiàn)),想要同時(shí)

在jsp頁(yè)面上,點(diǎn)擊生成相應(yīng)的一個(gè)<div>(這個(gè)已實(shí)現(xiàn)),想要同時(shí)自動(dòng)生成一個(gè)對(duì)應(yīng)js,執(zhí)行動(dòng)作

在jsp頁(yè)面上,點(diǎn)擊生成相應(yīng)的一個(gè)<div>(這個(gè)已實(shí)現(xiàn)),想要同時(shí)自動(dòng)生成一個(gè)對(duì)應(yīng)js;
其功能是讓生成的對(duì)應(yīng)的<div>,閃爍三次;
但如果在js上寫一個(gè)公用的function()方法的話會(huì)有線程問(wèn)題,
所以我想實(shí)現(xiàn)每點(diǎn)擊生成一個(gè)<div>就自動(dòng)生成一個(gè)對(duì)應(yīng)的js上的方法,這個(gè)怎么實(shí)現(xiàn)

回答
編輯回答
終相守

估計(jì)你應(yīng)該是共用了同一個(gè)定時(shí)器,提問(wèn)時(shí)最好貼出代碼。

<div>111</div>
<br>
<div>222</div>
<br>
<div>333</div>
<script type="text/javascript">
    var clickDiv = function(dom) {
        dom.onclick = function() {
            var count = 0;
            var task = setInterval(function() {
                if (count < 3) {
                    console.log(dom.innerHTML);
                    // blink(); /* 閃爍方法 */
                    count = count + 1;
                } else {
                    clearInterval(task);
                }
            }, 1000);
        };
    };

    var divs = document.getElementsByTagName('div')
    for (var i = 0; i < divs.length; i ++) {
        var div = divs[i];
        clickDiv(div);
    }
</script>

可以這么寫試試。
就但這個(gè)閃爍功能來(lái)看,如果不考慮 ie9 一下,純 css 就能實(shí)現(xiàn)。

div {
    width: 100px;
    height: 100px;
    background-color: pink;
    animation: blink .8s 3;
    -moz-animation: blink .8s 3;
    -webkit-animation: blink .8s 3;
    -o-animation: blink .8s 3;
}

@keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
@-moz-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
@-webkit-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
@-o-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
2017年6月19日 02:05
編輯回答
選擇

你理解的生成js方法是什么意思
直接在點(diǎn)擊直接中調(diào)用不是行了

2017年7月11日 14:21