Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/84.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 函数结束时新元素消失_Javascript_Html - Fatal编程技术网

Javascript 函数结束时新元素消失

Javascript 函数结束时新元素消失,javascript,html,Javascript,Html,我已经创建了一个简单的表单,允许用户创建大量具有可变行数和列数的空白表。代码不会生成错误,并短暂创建新的表元素,但当函数结束时,表消失。我做错了什么 function genTable(){ var numRows = parseInt(document.getElementById("numRows").value); // Number of rows per table var numCols = parseInt(document.getElementById("numC

我已经创建了一个简单的表单,允许用户创建大量具有可变行数和列数的空白表。代码不会生成错误,并短暂创建新的表元素,但当函数结束时,表消失。我做错了什么

function genTable(){
    var numRows = parseInt(document.getElementById("numRows").value); // Number of rows per table
    var numCols = parseInt(document.getElementById("numCols").value); // Number of columns per table
    var numTabs = parseInt(document.getElementById("numTabs").value); // number of tables

    var startDiv = document.getElementById("start");
    var oneCell = "<td class=\"cell\"></td>"; // HTML for a single cell
    var myHTML = ""; // An empty string to contain the tables

    for(i=0; i<numTabs; i++){
        myHTML += "<div><table class=\"linesTab\" id=\"winLine" + (i+1) + "\">";

        for(k=0; k<numRows; k++){
            myHTML += "<tr>";

            for(j=0; j<numCols; j++){
            myHTML += oneCell;
            }

            myHTML += "</tr>";
        }


        myHTML += "</table><br><span class=\"tabSpan\">" + (i+1) + "</span></div>";
    }

    startDiv.innerHTML= myHTML;

}

听起来像是在超链接或表单中内置了触发器。。。因此,尽管脚本运行,浏览器仍会导航和刷新页面

如果有单击事件,则需要停止该事件的传播

简短示例:

HTML

JavaScript

document.getElementById('clicker').onclick = function () {
    document.getElementById('example').innerHTML = 'Content';
    // return false; // <-- without this (or an alternative) the form posts
}

调用getTable的代码在哪里?调用getTable后它在做什么?当你说它简单地创建了它们时,你是说在屏幕上吗?这些表直到函数的最后一行才被添加到DOM中,因此,如果您在屏幕上看到这些表,然后它们很快就会消失,这意味着它们由于其他原因而消失。您是否使用了可能导致页面刷新的按钮?请您的问题包含复制问题所需的最小HTML片段。我们需要更多代码/标记来开始回答此问题。您也可以发布HTML吗?这是正确的答案!我的标签中有一个按钮,因此它可以导航到一个新页面,其中包含URL中的表单值。当我将按钮放在表单外部并将调用从onclick=genTable更改为脚本部分中的事件侦听器时,我的代码工作得非常好。
document.getElementById('clicker').onclick = function () {
    document.getElementById('example').innerHTML = 'Content';
    // return false; // <-- without this (or an alternative) the form posts
}