JavaScript, document.getElementById 不是从表格中抓取？

Question

我正在尝试创建一个日期时间本地输入，该输入将提交到一个函数中，该函数稍后会将其转换为不同的类型。我一直在尝试检查我正在使用的功能是否通过将其放入警报中来接收用户输入，但是每次我收到警报时，都不会显示信息，并在其位置显示“[object HTMLInputElement]”。很明显，如果我的错误测试甚至不能正常工作，我一定是做错了什么

下面是我的表格和脚本。

<form>
    Start Time:
    <input type="datetime-local" id="start">
    End Time:
    <input type="datetime-local" id="end">
    <input type="submit" value="Send" onclick="convert()">
</form>

<script>
    function convert() {
        var sd = new Date();   //start date
        var sds = new String();
        var ed = new Date();   //end date
        var eds = new String();
        var sd = document.getElementById("start");
        alert(sd);
        var sds = document.getElementById("end");
            alert(sds);
        }
</script>

有什么明显的突出之处吗？

Answer 1

只需调用 getElementById 即可 return 一个 HTMLInputElement 对象。要获取其值，您需要调用 .value

var sd = document.getElementById("start").value;

和

var sds = document.getElementById("end").value;

您还声明了变量 sd 两次。只需要一次。这增加了代码库并使事情变得不那么干燥。另外，不要像这样初始化一个新字符串

var eds = new String();

改为这样做

var eds = "";

我更新并改进了您的代码。

var startValue = document.getElementById("start-value");
var endValue = document.getElementById("end-value");

function convert() {
    var sd = new Date();   // start date
    var ed = new Date();   // end date
    var eds = new String();
    var sd = document.getElementById("start").value;
    startValue.innerHTML = sd;
    var sds = document.getElementById("end").value;
    endValue.innerHTML = sds;
}

<form>
    Start Time:
    <input type="datetime-local" id="start">
    End Time:
    <input type="datetime-local" id="end">
    <input type="submit" value="Send" onclick="convert()">
</form>

<p id="start-value"></p>
<p id="end-value"></p>

Answer 2

您已经声明了同一个变量两次，var sd。第一次你给它分配了一个 Date() 函数，第二次你给它分配了一个 document.getElementByID()。是的，正如绅士所说，innerHtml 需要包含在内才能获得该字段的值。

Answer 3

首先，点击事件不是您想要实现的目标的正确选择。其次，您必须在入口而不是表单上绑定事件。您可能想使用 on change 事件。我还强烈建议使用 socument states 和 wleventbindings。

JavaScript, document.getElementById 不是从表格中抓取？

JavaScript, document.getElementById not grabbing from form?

html

javascript

forms

getelementbyid