Question

我创建了一个脚本，用于编辑特定div的背景图像，颜色，大小和位置。在文档就绪脚本中搜索特定的div和加载设置

var color_default = $('.banneruser').css("background-color");
var image_default = $('.banneruser').css("background-image");
var align_default = $('.banneruser').css("background-position");
var size_default = $('.banneruser').css("background-size");

使用简单的面板我可以单独编辑所有设置，然后在保存按钮上执行ajax调用，将所有设置设置到数据库中

function don() {

            var color_set   = $('.banneruser').css("background-color");
        var align_set   = $('.banneruser').css("background-position");
        var size_set    = $('.banneruser').css("background-size");
        var image_set   = $('.banneruser').css("background-image");


        $.ajax({ 
            type: "GET",  
            url:  "set.php", 
            data: "color=" + color_set + "&align=" + align_set + "&size=" + size_set + "&image=" + image_set,
            success: function(response){
                alert(response);
            }
        });
        return false;
}

set.php 保存到数据库

<? include 'config.php'; connect(); session_start();

    $color=mysql_real_escape_string($_GET['color']);
    $image=mysql_real_escape_string($_GET['image']);
    $align=mysql_real_escape_string($_GET['align']);
    $size=mysql_real_escape_string($_GET['size']);

    //data
    $query = "SELECT * FROM utenti WHERE username='".$_SESSION['user']."'"; 
    $result = mysql_query($query);
    $id = mysql_result($result,0,"id");

    $banner = "background-color:".$color."; background-image:".$image."; background-position:".$align."; background-size:".$size."; ";

    $done= mysql_query("UPDATE `utenti` SET `banner` = '$banner'  WHERE `id` = '$id';");

    if($done){ echo '<i class="icon-ok-sign"></i>'; } else { echo '<i class="icon-warning-sign"></i>'; }

?>

基本上，这项工作完全在chrome上但火狐和IE设置成数据库这样一个奇怪的字符串

 background-color:rgb(219, 126, 50); background-image:url(" http:="" posth.it="" account="" felicegg="" banner.jpg");="" background-position:50%;="" background-size:auto;="" "="

即使我在我的数据库中完整地阅读它

background-color:rgb(219, 126, 50); background-image:url("http://posth.it/account/felicegg/banner.jpg"); background-position:50%; background-size:auto;

PS：如果我在chrome上设置设置，即firefox完全读取字符串，即使它发生了这个问题（也在chrome上）。

问题是为什么？：D有什么想法吗？

Answer 1

你应该逃避你的数据：

function don() {

        var color_set   = $('.banneruser').css("background-color");
        var align_set   = $('.banneruser').css("background-position");
        var size_set    = $('.banneruser').css("background-size");
        var image_set   = $('.banneruser').css("background-image");

        $.ajax({ 
            type: "GET",  
            url:  "set.php", 
            data: "color=" + encodeURI(color_set) + "&align=" + encodeURI(align_set) + "&size=" + encodeURI(size_set) + "&image=" + encodeURI(image_set),
            success: function(response){
                alert(response);
            }
        });
        return false;
}

用css jquery设置背景图像

1 个答案: