如何为按钮添加功能一次点击,下一次点击它应该在javascript

时间:2017-02-03 07:49:04

标签: javascript html

这里iam附上我的代码告诉我按钮如何执行功能并立即禁用,直到它刷新,我还必须为它设置计时器

请帮助如何做到这一点,我有不同大小的表来执行,所以当一个按钮执行时,其他一些按钮不起作用

<html>
   <head>
    <script type="text/javascript">

                function boardSize(id, btnid) {

            function hitheadr(id, btnid) {

                return function () {
                    console.log(id);
                };
                 document.getElementByid(btnid).disabled=true;
            }`
            function createTable(rows, cols, element) {
                function getButtonId(i, j) {
                    return 'hit'
                }
               var table = document.createElement('table'),
                    tr, td, button, i, j,
                    colors = ["red", "blue", "yellow"];

                for (i = 0; i < rows; i++) {
                    tr = document.createElement('tr');

                    for (j = 0; j < cols; j++) {
                        td = document.createElement('td');
                        button = document.createElement('button');
               button.style.backgroundColor  =colors[Math.floor(Math.random() * colors.length)];
                        button.appendChild(document.createTextNode(getButtonId(i, j)));
                        button.onclick = hitheadr(getButtonId(i, j));
                        button.id = getButtonId(i, j);
                        button.onclick = onBtnClick;

                                               button.id = getButtonId(i, j);
                        td.appendChild(button);
                        tr.appendChild(td);
                    }
                    table.appendChild(tr);
                    table.setAttribute("align", "center");
                    tr.setAttribute("border", "2");
                }
                element.appendChild(table);
            }

            createTable(3, 3, document.body);
        }

    </script> 
</head>

1 个答案:

答案 0 :(得分:0)

使用以下代码,您可以禁用按钮单击。 单击一次按钮后,此脚本将禁用您的下一次按钮单击,直到您刷新页面。    

            function boardSize(id, btnid) {

        function hitheadr(id, btnid) {

            return function () {
                console.log(id);
            };
             document.getElementByid(btnid).disabled=true;
        }`
        function createTable(rows, cols, element) {
            function getButtonId(i, j) {
                return 'hit'
            }
           var table = document.createElement('table'),
                tr, td, button, i, j,
                colors = ["red", "blue", "yellow"];

            for (i = 0; i < rows; i++) {
                tr = document.createElement('tr');

                for (j = 0; j < cols; j++) {
                    td = document.createElement('td');
                    button = document.createElement('button');
           button.style.backgroundColor  =colors[Math.floor(Math.random() * colors.length)];
                    button.appendChild(document.createTextNode(getButtonId(i, j)));
                    button.onclick = hitheadr(getButtonId(i, j));
                    button.id = getButtonId(i, j);
                    button.onclick = onBtnClick;

                                           button.id = getButtonId(i, j);
                    td.appendChild(button);
                    tr.appendChild(td);
                }
                table.appendChild(tr);
                table.setAttribute("align", "center");
                tr.setAttribute("border", "2");
            }
            element.appendChild(table);
        }

        createTable(3, 3, document.body);
    }

</script>