问题使用Javascript刷新div

我正试图编写一些代码，点击一个按钮后，将填充一个div，如下面的代码所示。问题是，我想确保如果按钮被多次点击，div可以重新加载。我尝试使用下面的refreshDiv函数来实现这一点，但是这包括点击按钮的操作什么也不做。问题使用Javascript刷新div

function buttonClickHandler() { 

    var divString = "foodJournal"; 
    refreshDiv(divString); 

    var divID = document.getElementById("foodJournal"); 
    var fieldset = document.createElement("fieldset"); 
    var legend = document.createElement("legend"); 
    legend.innerHTML = "Food Log"; 
    legend.setAttribute('id', "legend"); 
    divID.appendChild(fieldset); 
    fieldset.appendChild(legend); 

    //refreshes food journal div 
    var refreshDiv = function(element) { 
     node = document.getElementById(element); 
     while (node.hasChildNodes()) { 
      node.removeChild(node.lastChild); 
     } 
    }; 
}

任何帮助表示赞赏！

来源

2013-08-29 i_trope

您是否尝试过调试此代码？它是否到达'refreshDiv（）'方法？ –

您可以请创建一个[jsfiddle]（http://jsfiddle.net）与您的html和js包括在内。 –

如果您的项目可能，我也建议像jQuery一样的JavaScript库。所有这些都可以用几行代替。 –

在实际声明变量之前，您正在致电refreshDiv。将变量声明移到调用上方，它应该可以工作。

function buttonClickHandler() { 

    var divString = "foodJournal"; 
    //refreshes food journal div 
    var refreshDiv = function(element) { 
     node = document.getElementById(element); 
     while (node.hasChildNodes()) { 
      node.removeChild(node.lastChild); 
     } 
    }; 

    refreshDiv(divString); 

    var divID = document.getElementById("foodJournal"); 
    var fieldset = document.createElement("fieldset"); 
    var legend = document.createElement("legend"); 
    legend.innerHTML = "Food Log"; 
    legend.setAttribute('id', "legend"); 
    divID.appendChild(fieldset); 
    fieldset.appendChild(legend);  
}

来源

2013-08-29 18:45:26

-1

代码，因为你写它会导致控制台中的错误。在Chrome上，您会看到：

Uncaught TypeError: undefined is not a function

指向右边第一个refreshDiv(divString)声明。

虽然javascript中悬挂了变量，但只有声明被挂起，而不是任务。（see fiddle with error）

一个简单的解决方法是将变量声明及其在第一次调用之上的赋值移动到refreshDiv。（Simple fix example）

function buttonClickHandler() { 
    var divString = "foodJournal"; 

    //refreshes food journal div 
    var refreshDiv = function(element) { 
     node = document.getElementById(element); 
     while (node.hasChildNodes()) { 
      node.removeChild(node.lastChild); 
     } 
    }; 

    refreshDiv(divString); 

    var divID = document.getElementById("foodJournal"); 
    var fieldset = document.createElement("fieldset"); 
    var legend = document.createElement("legend"); 
    legend.innerHTML = "Food Log"; 
    legend.setAttribute('id', "legend"); 
    divID.appendChild(fieldset); 
    fieldset.appendChild(legend); 

}

书面您的样品中，实在是没有理由把一个单独的方法来清除DIV。如果这不仅仅是为了说明您遇到的问题，您可能会考虑重构代码以减少一些冗余并删除不必要的函数调用。

来源

2013-08-29 18:45:41 dc5

问题使用Javascript刷新div

回答

相关问题