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 中,我放置了这段代码

这是放置echo的地方 <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

这是我相信你正在努力实现的一个非常简化的版本。我已将您的身体更改为 div,因为身体不应该是 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 回答