是否可以将通过javascript获得的时间提交给表单？

Question

此按钮显示视频媒体的当前已用时间

<button name="test" onclick="alert(Math.floor(document.getElementById('video').currentTime) + 'secs elapsed!');">Show elapsed time</button>

这段经过的时间显然每秒都在变化。

是否可以将此经过的时间提交给表单？
如何自定义下面的代码？

<form action="/comments" method="post" >
    <input type="text" name="comment[body]" size="50" />
    <input type="hidden" name="comment[elapsed_time]" value="???????" />
    <button type="submit" >Submit!</button>
</form>

Answer 1

您希望在提交表单之前使用jQuery设置值

$("form").submit(function(event) {
  var video = $("#video"),
      time  = Math.floor(video.currentTime) + 'secs elapsed!');
  $(this).find("input[name=comment\\[elapsed_time\\]").val(time);
});

如果您（可以）在输入中添加id属性，则会更容易

<input type="hidden" name="comment[elapsed_time]" id="comment_elapsed_time">

那你的jQuery就变成了这个

$("form").submit(function(event) {
  var video = $("#video"),
      time  = Math.floor(video.currentTime) + 'secs elapsed!');
  $("#comment_elapsed_time").val(time);
});

Answer 2

HTML更改：

<form action="/comments" method="post" >
    <input type="text" name="comment[body]" size="50" />
    <input id="elapsed_time" type="hidden" name="comment[elapsed_time]" value="???????" />
    <button type="submit" >Submit!</button>
</form>

JS：

$('button').on('click', function(){
  $('#elapsed_time').val($('#video')[0].currentTime);

  //now submit the form if you want tp
  $('form').submit();
});

Answer 3

不使用jQuery，您可以将html更改为：

<form action="/comments" method="post" onsubmit="onFormSubmit()" >
    <input type="text" name="comment[body]" size="50" />
    <input type="hidden" name="comment[elapsed_time]" />
    <button type="submit" >Submit!</button>
</form>

并在<head>添加此JavaScript：

<script>
    function onFormSubmit() {
        var element = document.getElementsByName("comment[elapsed_time]")[0];
        element.value = Math.floor(document.getElementById('video').currentTime);
        return true;
    }
</script>

Answer 4

在表单中添加一些id以便于操作，这是没有必要的。

<form action="/comments" method="post" >
    <input type="text" name="comment[body]" size="50" />
    <input id="elapsedTimeTextBox" type="hidden" name="comment[elapsed_time]" value="???????" />
    <button id="submitButton" type="submit" >Submit!</button>
</form>

如果使用jQuery，请在提交按钮中挂钩事件

$('#submitButton').click (function () {
   $('#elapsedTimeTextBox').val(Math.floor(document.getElementById('video').currentTime);
});

是否可以将通过javascript获得的时间提交给表单？

问题描述

4 个解决方案

解决方案1
3 已采纳 2013-08-21 01:34:41

解决方案2
2 2013-08-21 01:35:08

解决方案3
2 2013-08-21 01:37:15

解决方案4
1 2013-08-21 01:35:51

是否可以将通过javascript获得的时间提交给表单？

问题描述

4 个解决方案

解决方案1 3 已采纳 2013-08-21 01:34:41

解决方案2 2 2013-08-21 01:35:08

解决方案3 2 2013-08-21 01:37:15

解决方案4 1 2013-08-21 01:35:51

解决方案1
3 已采纳 2013-08-21 01:34:41

解决方案2
2 2013-08-21 01:35:08

解决方案3
2 2013-08-21 01:37:15

解决方案4
1 2013-08-21 01:35:51