jquery:如何使用<输入类型="time">的值

Question

我正在尝试在 Tizen 操作系统中的移动设备上创建自己的应用程序。由于它有闹钟功能，我需要从用户那里获取时间。因此，我将这段代码放入 HTML 中:

第二页的 HTML 部分

   <div data-role="content">
        <p> room name : <div class = "roomNameOutput"></div></p>
        <p> your name  : <div class = "userNameOutput"></div></p>
        <p> zombie num : <input type = "number" id = "zombieNumInput"></input></p>
        <p> zombie time : <input type = "time" id = "zombieTimeInput"></input></p>
        <p> finish time : <input type = "time" id = "finishTimeInput"></input></p>
    </div>
    <div data-role="footer" data-position="fixed">
        <a href="#host_page1" data-role="button" id = "hostRefreshButton">Refresh</a>
        <a href="#join_page2" data-role="button" id = "hostStartButton">Start Game</a>
    </div>

第三页的 HTML 部分

  <div data-role="content">
    <h1>start game!</h1>
    <p> room name : <div class = "roomNameOutput"></div></p>
    <p> user name  : <div class = "userNameOutput"></div></p>
    <p> zombie num  : <div class = "zombieNumOutput"></div></p>
    <p> zombie time  : <div class = "zombieTimeOutput">zombieTimeOutput Default Text</div></p>
        <p> finish time : <div class = "finishTimeOutput"></div></p>
 </div>

JS

$("#hostStartButton").click(function(){
    zombieNum = $("#zombieNumInput").val();
    zombieTime= $("#zombieTimeInput").val();
    finishTime= $("#finishTimeInput").val();
    $(".zombieNumOutput").text(zombieNum);
    $(".zombieTimeOutput").html(zombieTime);
    $(".finishTimeOutput").text(finishTime);
    console.log("ZT==" + zombieTime);
    console.log($("#finishTimeInput").val());
});

zombieNum 效果很好。我可以获取它的输入并显示它，但是 zombieTime 却不能。

在zombieNumOutput上，zombieNum在zombieTimeOutput上显示良好，zombieTime则不出现。和 [zombieTimeOutput 默认文本] 消失。

<p> zombie num  : <div class = "zombieNumOutput"></div></p>
<p> zombie time  : <div class = "zombieTimeOutput">zombieTimeOutput Default Text</div></p>

此外，控制台上仅出现“ZT==”和“”

console.log("ZT==" + zombieTime);
console.log($("#finishTimeInput").val());

Answer 1

您的代码存在三个问题:

1. $("#hostStartButton")应该是$("#hostButton") .
2. 添加结束语 </INPUT>标签 <input type="time" id="zombieTimeInput"> 之后
3. 将zombieTimeOutput定义为my JSFiddle当我注释掉该行时有效。请注意，您将其定位为类，而不是像其他元素一样的 ID。