如何从日历中获取输入并使用JavaScript和HTML打印日期_Javascript_Html

如何从日历中获取输入并使用JavaScript和HTML打印日期

javascript html

如何从日历中获取输入并使用JavaScript和HTML打印日期,javascript,html,Javascript,Html,首先，我对使用JavaScript和HTML非常陌生。现在我有一个日历，用户可以在其中选择他们想要的日期。选中后，我希望现在在网站上打印日期。因此，如果用户选择2019年10月13日，我希望2019年10月13日打印在我的中。问题是，当您选择日期时，日期选择器将更新输入，但以编程方式更新输入不会触发更改事件我看到两个选项（可能还有更多）可以解决这个问题：近似解决方案：收听blur事件（更）复杂的解决方案：在身体上使用变异观察者，并找出日期选择器何时关闭（元素被移除）你几乎是对的，只需在

首先，我对使用JavaScript和HTML非常陌生。现在我有一个日历，用户可以在其中选择他们想要的日期。选中后，我希望现在在网站上打印日期。因此，如果用户选择2019年10月13日，我希望2019年10月13日打印在我的中。问题是，当您选择日期时，日期选择器将更新输入，但以编程方式更新输入不会触发

更改

事件

我看到两个选项（可能还有更多）可以解决这个问题：

近似解决方案：收听
```
blur
```
事件
（更）复杂的解决方案：在身体上使用变异观察者，并找出日期选择器何时关闭（元素被移除）

你几乎是对的，只需在

文档.getElementById（'demo'）

和

=input之间添加.textContent
或.innerText
。另外，我建议使用onchange
事件而不是onclick…document.getElementById（'demo'）。innerText=input；我把它改成了这个，但是我的网站上没有任何输出使用onchange事件而不是onclick。。。我建议避免使用内联侦听器，但使用它们不会造成问题。嗯，我已经更改了它，但它仍然没有显示出来，我不知道是否有什么问题出现在我这边。
<html>

<head>
   <script src="https://cdn.syncfusion.com/ej2/dist/ej2.min.js"></script>
   <link href="https://cdn.syncfusion.com/ej2/material.css" rel="stylesheet">
</head>

<body>
<div style= text-align:center>
    <input id="datepicker"  onclick="print()" type="text">
    </div>

<p> Testing my Calender input </p>
<p id="demo"></p>


<script type="text/javascript">

    var datepicker = new ej.calendars.DatePicker({ width: "300px" });
    datepicker.appendTo('#datepicker');



    function print()
    {
      var input = document.getElementById("datepicker").value;

      document.getElementById('demo') = input;

    }

</script>



 </body>

</html>