Question

我试图保存我正在单击提交的视频的当前时间戳。但是在表格中，只有0会被保存，我无法获取和保存视频的当前时间戳。尽管它已显示但未保存在SQL表中。

注意：timestamp（tstamp）：是一个动态值，它是在浏览器中播放的视频文件的时间戳（例如1.935771），

fileUpload.php

<body>
    <h1>VIDO LABELLING TOOL</h1>

    <video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="268"
        data-setup='{ "playbackRates": [0.5, 1, 1.5, 2, 4] }'>
        <source src="project.m4v" type='video/mp4'>
        <track src='br.srt' kind="subtitles" srclang="en" label="English" default>
    </video>



    <script>
        // Get the audio element with id="my_video_1"
        var aud = document.getElementById("my_video_1");

        // Assign an ontimeupdate event to the audio element, and execute a function if the current playback position has changed
        aud.ontimeupdate = function () {
            myFunction()
        };
    </script>


    <div class="container" style="max-width:800px;margin:0 auto;margin-top:50px;">
        <form name="contact-form" action="" method="post" id="contact-form">
            <label for="email">Comments about the frame</label>
            <textarea name="message" class="form-control" id="message"></textarea>

            <div class="error" id="error_message"></div>

            <label>Vehicle Type:</label>
            <input name="veh_type_1" id="veh_type_1" type="checkbox" value="lmv">lmv
            <input name="veh_type_2" id="veh_type_2" type="checkbox" value="2w">2w
            <p>TimeStamp: <span id="tstamp"></span></p>
    </div>
    <p class="submit">
        <button type="submit" class="btn btn-primary" name="submit" value="Submit" id="submit_form">Submit</button>
    </p>

    <div class="display-content">
        <div class="message-wrap dn"> </div>
    </div>
    </form>
    </div>


    <script>
        function myFunction() {
            document.getElementById("tstamp").innerHTML = aud.currentTime;
        }
    </script>


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#contact-form").on("submit", function (e) {
                e.preventDefault();
                $.ajax({
                    type: 'post',
                    url: "saveFile.php",
                    data: $(this).serialize(),
                    success: function () {
                        alert("form was submitted");
                    }
                });
                return false;
            });
        });
    </script>
</body>

和用于db的php文件更新为：-

saveFile.php

<?php
$servername = "localhost";
$database = "stackover";
$username = "root";
$password = "123456";

// Create connection

$conn = mysqli_connect($servername, $username, $password, $database);

// Check connection

if (!$conn) {
    die("Connection failed: " . mysqli_connect_error());
}

echo "Connected successfully";

$tstamp = addslashes($_POST['tstamp']);
$message = addslashes($_POST['message']);
$veh_type_1 = addslashes($_POST['veh_type_1']);
$veh_type_2 = addslashes($_POST['veh_type_2']);
mysqli_query($conn, "insert into saveData(message,tstamp,veh_type_1, veh_type_2) values ('$message','$tstamp','$veh_type_1', '$veh_type_2')");
$sql = mysqli_query($conn, "SELECT message,tstamp,veh_type_1,veh_type_2 id FROM saveData order by id desc");

$result = mysqli_fetch_array($sql);
echo '<div class="message-wrap">' . $result['message'] . '</div>';
?>

Answer 1

请将此添加到您的表单中

<input name="tstamp" id="hidden-tstamp" type="hidden">

并在脚本内添加以下代码

function myFunction() {
   document.getElementById("tstamp").innerHTML = aud.currentTime;
   document.getElementById('hidden-tstamp').value = aud.currentTime;
}

无法将时间戳从表单数据保存到sql数据库

1 个答案: