0

わかりました これは、ここにいる皆さんにとってはユニークな質問かもしれません。ユーザーがアカウントの背景を変更できるサイトを作成しています..だから私はここまで到達しました..ここで助けが必要です.

Javascript コード

<script type="text/javascript" >
 $(document).ready(function() { 
        $('#photoimg').live('change', function()            { 
                       $("#preview").html('');
                $("#preview").html("<body background="http://mysite.com/image/loading.jpg"></body>");
            $("#imageform").ajaxForm({
                        target: '#preview'
        }).submit();

            });
        }); 
</script>

HTMLでは、このコードを配置しました

これはエコーを置く場所です <div id="preview"></div>

  1. ここはdivタグでやってみた

    <div id="preview"> <body background="http://mysite.com/image/please_add_backqround.jpg"></body> </div>

  2. バックグラウンドでスタイルで試してみました

    <div id="preview"> <body style="background-image: url(http://mysite.com/image/please_add_backqround.jpg);"> </div> </body>

  3. ほぼページ全体をカバーする div のスタイルで試しました。

    <html><body> <div id="preview"> <div id="covering_whole_page" style="background-image:url ( http://mysite.com/image/please_add_backqround.jpg);"></div></div></html>

それらのどれも機能していません。:(

HTML フォーム

<form id="imageform" method="post" enctype="multipart/form-data" action='ajaximage.php'> <input type="file" title="upload your fav. background" name="photoimg" id="photoimg" onchange="pressedx()"></form>

ajaximage.php

<?php
session_start();
$session_id='1'; //$session id
$path = "uploads/";

    $valid_formats = array("jpg", "png", "gif", "bmp");
    if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
        {
            $name = $_FILES['photoimg']['name'];
            $size = $_FILES['photoimg']['size'];

            if(strlen($name))
                {
                    list($txt, $ext) = explode(".", $name);
                    if(in_array($ext,$valid_formats))
                    {
                    if($size<(1024*1024))
                        {
                            $actual_image_name = time().substr(str_replace(" ", "_", $txt), 5).".".$ext;
                            $tmp = $_FILES['photoimg']['tmp_name'];
                            if(move_uploaded_file($tmp, $path.$actual_image_name))
                                {
                                //sqlquery space
                        echo "<body background='uploads/".$actual_image_name."' ></body>";
                        }
                            else
                                echo "failed";
                        }
                        else
                        echo "Image file size max 1 MB";                    
                        }
                        else
                        echo "Invalid file format..";   
                }

            else
                echo "Please select image..!";

            exit;
        }
?>

また、データベースにアップロードされたファイルを追加したいので、ユーザーが[保存]をクリックすると、データベースに保存される特定のjpg名が削除されます..ありがとう

4

1 に答える 1

1

これは、あなたが達成しようとしていると私が信じていることの非常に単純化されたバージョンです。body は div の子であってはならないため、body を div に変更しました。

Javascript + HTML

<script>
$(document).ready(function() {
    $('#ajaxForm').ajaxForm(function(response) { 
        var newImage = response;
        //alert(response); -- check your response is correct
        $('#preview > div').css("background-image","url(" + response + ")");
    });
});
</script>

<div id="preview">
    <div style="background-image: url(testimage1.png); width: 100%; height: 400px;"></div>    
</div>
<form method="post" id="ajaxForm" action="ajaximage.php">
<input type="submit" value="submit" />
</form>

ajaximage.php

<?php
//Your code returns the url -- omitted your code for simplicity
echo "testimage2.jpg";

ajaximage が単純に URL を返すことがわかるはずです。ajaxForm を使用してこの応答を取得し、javascript を使用して背景画像を動的に更新できます。

于 2013-07-27T23:17:53.207 に答える