Question

我具有此功能，当单击按钮时，会在有序列表中生成一组元素，生成的组中的所有元素都具有相同的id /时间戳。该函数可以正常工作，直到“ if”语句验证/创建/推送ID数组为止。我不明白为什么它不会执行。

这是我的JS函数，对不起，长度：

function spawnSilly() //spawn chapters function
        {
            const timestamp = new Date().getUTCMilliseconds();

            var div = document.createElement("LI"); //creating elements
            var input = document.createElement("INPUT");
            var button = document.createElement("BUTTON");
            var del_button = document.createElement("BUTTON")
            input.setAttribute("type", "text");     //setting attributes
            input.setAttribute("placeholder", "Title");
            input.setAttribute("id", timestamp.toString())
            button.setAttribute("type", "button");
            button.setAttribute("onClick", "redirect()");
            button.setAttribute("id", timestamp.toString())
            button.innerHTML = "Edit";
            div.setAttribute("id", timestamp.toString())
            del_button.setAttribute("id", timestamp.toString())
            del_button.innerHTML = "Delete Chapter";
            del_button.setAttribute("onClick", "removeElement(this.id)")
            div.appendChild(input)      //appending to list
            div.appendChild(button)
            div.appendChild(del_button);
            var chapterNumber = getCount(document.getElementById('spawnList'), false) //setting number of spawn
            var number = $('#spawnList').children(); //fetching number of children in list
             //setting chapter number to string for name attribute in input
            var list = document.getElementById("spawnList")
            list.insertBefore(div, list.childNodes[number]) //inserting one after another
            var newSpawnNumber = string(number + 1);  //setting elements class as their spawn number
            input.setAttribute("class", newSpawnNumber)
            button.setAttribute("class", newSpawnNumber)
            div.setAttribute("class", newSpawnNumber)
            del_button.setAttribute("class", newSpawnNumber)
            input.setAttribute("index", newSpawnNumber)
            button.setAttribute("index", newSpawnNumber)
            div.setAttribute("index", newSpawnNumber)
            del_button.setAttribute("index", newSpawnNumber)
            if (typeof idArray !== "undefined")
                {
                    idArray.push("#" + new Date().getUTCMilliseconds().toString())
                    alert("push success")
                }
            else if (typeof idArray == "undefined")
                {
                    idArray = new Array()
                    idArray.push("#" + new Date().getUTCMilliseconds().toString())
                    alert("created new array, push success")
                }
            else
                {
                    alert("error")
                }
            alert("success")
        }

    </script>

如果我在if语句之前执行警报，但是如果我不在if语句之后执行警报，则很奇怪。

这是我的HTML：

<a href="#" onclick="alert(getCount(document.getElementById('spawnList'), false));">Count Spawn</a><br/>
<form action="spawn-title-processing.php" method="post">
  <ol id="spawnList">


  </ol>
  <button type="button" id="spawnbtn" onClick="spawnSilly();">Add </button>
  <button type="button" name="spawnSubmit" onClick="submit_chpt">Save</button>
</form>

这些是控制台错误：

    Uncaught ReferenceError: string is not defined
    at spawnSilly (post_creation.php:162)
    at HTMLButtonElement.onclick (VM786 post_creation.php:197)
spawnSilly @ post_creation.php:162
onclick @ VM786 post_creation.php:197

任何帮助都是太棒了！：）

Answer 1

您正在以错误的方式检查if条件是否未定义。您需要更改以下几行。

来自

 if (idArray !== undefined) {

到

if (typeof idArray !== "undefined") {

来自

} else if (idArray == undefined) {

到

} else if (typeof idArray == "undefined") {

已更新：

您还需要更改此行

来自

idArray.push("#" + string(new Date().getUTCMilliseconds()))

到

idArray.push("#" + new Date().getUTCMilliseconds().toString())

function spawnSilly() //spawn chapters function
{

  var div = document.createElement("LI"); //creating elements
  var input = document.createElement("INPUT");
  var button = document.createElement("BUTTON");
  var del_button = document.createElement("BUTTON")
  input.setAttribute("type", "text"); //setting attributes
  input.setAttribute("placeholder", "Title");
  input.setAttribute("id", "var timestamp = new Date().getUTCMilliseconds();")
  button.setAttribute("type", "button");
  button.setAttribute("onClick", "redirect()");
  button.setAttribute("id", "var timestamp = new Date().getUTCMilliseconds();")
  button.innerHTML = "Edit";
  div.setAttribute("id", "var timestamp = new Date().getUTCMilliseconds();")
  del_button.setAttribute("id", "var timestamp = new Date().getUTCMilliseconds();")
  del_button.innerHTML = "Delete Chapter";
  del_button.setAttribute("onClick", "removeElement(this.id)")
  div.appendChild(input) //appending to list
  div.appendChild(button)
  div.appendChild(del_button);
  var spawnNumber = 10;
  //getCount(document.getElementById('spawnList'), false) //setting number of spawn
  var number = $('#spawnList').children(); //fetching number of children in list
  var stringNumber = String(number) //setting spawn number to string for name attribute in input
  var list = document.getElementById("spawnList")
  list.insertBefore(div, list.childNodes[number]) //inserting one after another
  var newSpawnNumber = spawnNumber + 1; //setting elements class as their spawn number
  input.setAttribute("class", newSpawnNumber)
  button.setAttribute("class", newSpawnNumber)
  div.setAttribute("class", newSpawnNumber)
  del_button.setAttribute("class", newSpawnNumber)
  input.setAttribute("index", newSpawnNumber)
  button.setAttribute("index", newSpawnNumber)
  div.setAttribute("index", newSpawnNumber)
  del_button.setAttribute("index", newSpawnNumber)
  if (typeof idArray !== "undefined") {
    idArray.push("#" + new Date().getUTCMilliseconds().toString())
    alert("push success")
  } else if (typeof idArray == "undefined") {
    idArray = new Array()
    idArray.push("#" + new Date().getUTCMilliseconds().toString())
    alert("created new aray, push success")
  } else {
    alert("error")
  }
  alert("success")
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#" onclick="alert(getCount(document.getElementById('spawnList'), false));">Count Spawn</a><br/>
<form action="spawn-title-processing.php" method="post">
  <ol id="spawnList">


  </ol>
  <button type="button" id="spawnbtn" onClick="spawnSilly();">Add </button>
  <button type="button" name="spawnSubmit" onClick="submit_chpt">Save</button>
</form>

Answer 2

您的idArray在if语句中未定义，这肯定会导致错误，而这就是程序停止的地方。

建议，最好使代码干净。

例如

//spawn chapters function
function spawnSilly() {
  const timestamp = new Date().getUTCMilliseconds();

  var li = document.createElement("LI"); 
  li.setAttribute("id", timestamp)

  var input = document.createElement("INPUT");
  input.setAttribute("type", "text");
  input.setAttribute("placeholder", "Title");
  input.setAttribute("id", timestamp)

  var button = document.createElement("BUTTON");
  button.setAttribute("type", "button");
  button.setAttribute("onClick", "redirect()");
  button.setAttribute("id", timestamp)
  button.innerHTML = "Edit";

  var del_button = document.createElement("BUTTON")
  del_button.setAttribute("id", timestamp)
  del_button.setAttribute("onClick", "removeElement(this.id)")
  del_button.innerHTML = "Delete Chapter";

  //appending to list
  li.appendChild(input)
  li.appendChild(button)
  li.appendChild(del_button);

  // and so on...
}

Answer 3

window.cn = function(o) { return"undefined" == typeof o || null == o || "" == o.toString().trim()}

之后，您像这样检查变量

window.cn(idArray)

如果value不在idArray中，则返回false。

无法获得if语句在onClick函数中执行

3 个答案: