Question

我想收集25个计划时间（小时和分钟）。用户将使用下拉框输入25次。这意味着，25小时25分钟的下拉盒，总共50个下拉盒。但我不需要将它们作为单个变量发送。像08:05;08:37;09:43;09:59:11:12;12:34这样的一个字符串就可以了。

因此，要发送的变量将类似于 - time=08:05;08:37;09:43;09:59:11:12;12:34

我认为这很容易 - 用户按下提交按钮，50个下拉框中的所有变量将生成一个字符串，然后发送该字符串。

怎么做？有任何想法吗？有什么建议吗？

任何关于此的示例或教程都是适用的。

Answer 1

选项1 - 将onSubmit添加到表单中。使用javascript生成字符串并将其设置为隐藏变量。如果没有JS框架，如jquery或mootools，这可能会变得丑陋。

选项2 - 使用数组结构。正常提交表单并使用php脚本解析数组。

<!-- HTML -->
<select name="data[1][hour]">...</select><select name="data[1][minute]">...</select>
<select name="data[2][hour]">...</select><select name="data[2][minute]">...</select>
...
...
<select name="data[25][hour]">...</select><select name="data[25][minute]">...</select>


<?php
// PHP
$data = array();
for ($i=1;$i<=25;$i++){
   $data[] = $_POST['data'][$i]['hour'].':'$_POST['data'][$i]['minute']
}
$dataString = implode(';', $data);
?>

Answer 2

以下是使用jQuery＆amp;的解决方案jquery.calendrical：

<html>
<head>
    <title>S.O. 3664773</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script src="http://tobiascohen.com/demos/calendrical/jquery.calendrical.js"></script>
    <link rel="stylesheet" href="http://tobiascohen.com/demos/calendrical/calendrical.css" /> 
    <script type="text/javascript">
    var gEnd = 25;

    // borrowed from jquery.calendrical sources
    function parseTime(text) {
        var match = match = /(\d+)\s*[:\-\.,]\s*(\d+)\s*(am|pm)?/i.exec(text);
        if (match && match.length >= 3) {
            var hour = Number(match[1]);
            var minute = Number(match[2])
            if (hour == 12 && match[3]) hour -= 12;
            if (match[3] && match[3].toLowerCase() == 'pm') hour += 12;
            if (hour < 10) hour = '0' + hour;
            if (minute < 10) minute = '0' + minute;
            return {
                hour:   hour,
                minute: minute
            };
        } else {
            return null;
        }
    }

    $(document).ready(function() {
        $('#time').calendricalTime();
        $('#submit-btn').val('End (' + gEnd + ')');

        $('#add').click(function() {
            var hm = parseTime($('#time').val());
            var li = $('<li></li>').text(
                hm.hour + ":" + 
                hm.minute);
            $('#input').append(li);
            --gEnd;
            $('#submit-btn').val('End (' + gEnd + ')');
        });

        $('#addForm').submit(function() {
            var ul = "";

            $('#input li').each(function() {
                ul += $(this).html() + ";"
            });

            alert("About to submit: time=" + ul.replace(/;$/, '')); 
            return false; // don't submit
        });
    });
    </script>
</head>
<body>
<ol id="input">
</ol>
<form id="addForm">
    <input id="time" type="text" /> 
    <input type="button" id="add" value="Add"/>
    <input type="submit" id="submit-btn" value="End"/>
</form>
</body>
</html>

Answer 3

使用jQuery的另一个例子。您将在示例中找到提交带有唯一隐藏字段的“隐藏”表单的选项。这允许您在POST变量中发送数据而不使用SELECT字段

中的其他50个变量

<!-- your form with your 50 select fields -->
<form id="myform">
<select id="hour1" ...></select>
<select id="min1" ...></select>
<select id="hour2" ...></select>
<select id="min2" ...></select>
...
<select id="hour25" ...></select>
<select id="min25" ...></select>
</form>

<!-- if you want to "simulate" the submission of a form without 
your 50 select fields you'll need to include this form and hide it in css -->
<form id="myform2" action="..." method="post">
<input type="hidden" name="myvars" value="" />
</form>

<script type="text/javascript">
jQuery(function($){

    // on submit of the #myform form
    $('#myform').submit(function(){
        // create the unique variable: myvars
        var myvars = 'time=';
        for(var i=1; i<=25; i++) {
            myvars += $('#hour'+i).val() + ':' + $('#min'+i).val() + ';';
        }
        // if you want to get rid of the last ";" you can add:
        myvars = myvars.replace(/^;$/, '');

        // you can do whatever you want with "myvars" here
        // or make a submission with the hidden form to "simulate"
        // the submission of a form with the data in
        // a POST variable

        $('#myform2 input[name=myvars]').val(myvars);
        $('#myform2').trigger('submit');

        return false; // to cancel the "normal" submit
    });
});
</script>

Answer 4

使用date.getTime（）返回自此Date对象表示的1970年1月1日00:00:00 GMT以来的毫秒数。这是一个很长的价值。您可以使用以'，'或'|'分隔的内容（或任何其他任意性质）。在您的服务器上，您可以再次根据该长值启动您的时间。希望它有所帮助！

如何在发送到服务器之前操作表单数据？

4 个答案: