Question

我的JavaScript代码无效。我想要的很简单，我想在点击父级时显示/隐藏子div。但我想在不使用jQuery或任何其他库的情况下在纯JavaScript中完成它。这是我的JavaScript代码：

＆＃13;

    function addCal(){

	  var inDate=document.getElementById("date_in");
	  if(inDate.childNodes.length<2)
	   {
        var inCal= document.createElement("div");
        inCal.id="inCal";
        var inText= document.createTextNode("Hello");
        inCal.appendChild(inText);
        inDate.appendChild(inCal); 

       } else 
         {
	      return false;
         }

    }

    function removeCal(){

	 var inCal=document.getElementById("inCal");

	 if(inCal)
	  {
		inCal.parentNode.removeChild(inCal);
	  } else 
	   {
		return false;
	   }

    }
    document.getElementById("date_in").addEventListener("click", addCal);

    document.getElementById("date_in").addEventListener("click",removeCal);

＆＃13;

    <div id="date_in"><input type="date" name="date_in"/></div>
    <div id="dat_out"><input type="date" name="date_out"/></div>
    
    <div id="submit"><input type="submit" value="Submit"/>

＆＃13;

我已将javaScript代码放在关闭正文标记附近。任何人都可以建议为什么这个代码不起作用或任何更好的方法来实现这一目标。

Answer 1

您已将[100, 100] [1, 0.2] [100, 100] [1, 0.8] [100, 100] [1, 0.2] [100, 100] [1, 0.8]和addCal添加为同一事件的侦听器。点击后，系统会调用removeCal，addCal将撤消之后立即执行的操作。考虑添加一个侦听器，根据removeCal的存在来决定调用哪个函数。

inCal

单击纯javascript显示/隐藏div

1 个答案: