8

写真付きの送信フォームを作成しようとしています。ユーザーが送信ボタンを押した写真を読み込んだ後、フォームを10秒間一時停止し、その10秒間プログレスバーをアニメーション化してからフォームを送信します。私が間違ったことを言ってもらえますか？ 10秒後にフォームを送信します。コードは次のとおりです。

HTML：

<form action="uploadpic.php" method="post" id="upload_form">
<input type="text" name="title" id="title">
<p id="title_p">Title</p>

<hr />

<input type="text" name="theme" id="picture_theme" size="40"/>
<p id="theme">Picture Theme<img src="../simages/info.gif" id="info" width="12" height="12" style="margin-left:10px;"></p>
<hr />

<div class="custom-upload">
    <input type="file" name="picture" id="true_pic" />
    <div class="fake-file">
        <input disabled="disabled" >
    </div>
</div>
<p id="upload_pic">Upload picture</p>​

<input type="submit" name="submit" id="submit" value="Upload" />
</form>

JAVASCRIPT：

form = document.getElementById("upload_form");
    size=1;
    form.onsubmit = function()
    {
        if (size < 10)
        {
            setTimeout(delayedSubmit,1000); 
        }
        return false;
    }
    function delayedSubmit() {
        size++;
            if (size<5)
            {
                setTimeout(delayedSubmit,1000);
                alert("Counting "+size);    
            }
            else
            {
                alert("Form submitted");
                form.submit();
            }
    }

PHP：

<?php

if ($_POST['submit'])
{
    $title = $_POST['title'];
    $theme = $_POST['picture_theme'];
    echo $title," ",$theme; 
}




 ?>

php変数が何も表示せず、ページが読み込まれないという事実から、フォームは何も送信しないことがわかります。

4

2 に答える 2

4

フォームに「送信」という名前および/またはIDのボタンがある場合、それは機能しなくなります(私の古い投稿は間違っていました)。

したがって、ボタンの名前/IDを変更する必要があります。

<input type="submit" name="submit-button" id="submit-button" value="Upload" />

覚えておいてください: PHP も変更する必要があります。

if ($_POST['submit'])
{
    $title = $_POST['title'];
    $theme = $_POST['picture_theme'];
    echo $title," ",$theme; 
}

に

if ($_POST['submit-button'])
{
    $title = $_POST['title'];
    $theme = $_POST['picture_theme'];
    echo $title," ",$theme; 
}
于 2012-12-20T09:52:22.103 に答える
1

私はjavascriptを単純化します：

form = document.getElementById("upload_form");
size=0;

form.onsubmit = delayedSubmit;

function delayedSubmit () {
    if (++size < 5) {
        alert("Counting "+size);    
        setTimeout(delayedSubmit,1000);
        return false;
    } 
    alert("Form submitted");
    form.submit();
}

そして - もちろん - 送信ボタンから ID と名前を削除 (または変更) します。

<input type="submit" value="Upload" />

例: http://jsbin.com/equiyit/1/edit

于 2012-12-20T10:15:45.853 に答える