jQuery没有使用它的组件是彩色动画和ajax

时间:2016-01-03 05:49:10

标签: javascript php jquery ajax sql-update

我是jQuery的新手,我正在尝试创建一个不同颜色的页面,当我们点击任何一个页面时,它会更改导航栏和页脚的背景颜色,并使用ajax更新{{ 1}} database.So这是我的MYSQL代码:

jQuery

这就是我的代码。我不知道它有什么问题,但我真的需要帮助。 注意:我已经包含了$(document).ready(function() { $('[name="personal_theme_color"]').click(function() { var a = $('[name="personal_theme_color"]').val(); switch (a) { case "pink": var b = "#e91e63"; break; case "purple": b = "#9c27b0"; break; case "deep-purple": b = "#673ab7"; break; case "indigo": b = "#3f51b5"; break; case "light-blue": b = "#03a9f4"; break; case "cyan": b = "#00bcd4"; break; case "green": b = "#4caf50"; break; case "light-green": b = "#8bc34a"; break; case "lime": b = "#cddc39"; break; case "yellow": b = "#ffeb3b"; break; case "amber": b = "#ffc107"; break; case "orange": b = "#ff9800"; break; case "deep-orange": b = "#ff5722"; break; case "brown": b = "#9e9e9e"; break; case "grey": b = "#9e9e9e"; } $(".nav-wrapper").animate({ backgroundColor: b }); $("footer").animate({ backgroundColor: b }); $.ajax({ type: "POST", url: "jsp/update_user_theme.php", data: "theme=" + a, cache: false, success: function(a) { alert("Updated successfully"); } }); }); }); 颜色动画插件

我的jQuery代码:

PHP

P.S。我非常感谢<?php require_once('http://' . $_SERVER['SERVER_NAME'] . '/sp/conn.php'); $theme = mysqli_fetch_array($dbc, trim(htmlentities($_POST['theme']))); // Now update query $query = "UPDATE user set theme = '$themecolor', hex2 = '$hex' WHERE id = '" . $_COOKIE['id'] . "'"; mysqli_query($dbc, $query); ?> 代码中的一些帮助,尤其是使它PHP注入防护。先感谢您 祝你有个美好的一天

编辑: HTML。我使用SQL循环从数组中获取这些值。但是这个html是硬编码的(来自foreach的chrome)。查看标签和输入标签的类和值的差异。:

view-source:

还有我的网页截图: This is how my page looks

2 个答案:

答案 0 :(得分:2)

尝试以下更改:

data

选项2: 更直观的方法是在包含十六进制值的单选按钮上创建<input name="personal_theme_color" type="radio" class="with-gap" value="cyan" data-color="#00bcd4" /> <input name="personal_theme_color" type="radio" class="with-gap" value="pink" data-color="#e91e63" /> <input name="personal_theme_color" type="radio" class="with-gap" value="purple" data-color="#9c27b0" /> <input name="personal_theme_color" type="radio" class="with-gap" value="orange" data-color="#ff9800" /> <script> $(document).ready(function () { $("input[name=personal_theme_color]").click(function(e) { // Assign the object var thisObj = $(this); // Extract the color from the data-color attribute var color = thisObj.data('color'); // Get the value of the radio button var value = thisObj.val(); // Assign the url var url = 'jsp/update_user_theme.php'; $('.nav-wrapper').animate({ backgroundColor : color }); $('footer').animate({ backgroundColor : color }); $.ajax({ type: "POST", url: url, data: { theme: value }, cache: false, success: function (response) { console.log(response); alert('Updated successfully'); } }); }); }); </script> 属性:

<?php
    // I would suggest using __DIR__ relative to this file instead of the $_SERVER
    require_once(__DIR__.'/sp/conn.php');
    $theme = mysqli_fetch_array($dbc, trim(htmlentities($_POST['theme'])));

    // You may want to use $_SESSION instead of $_COOKIE
    $query = "UPDATE user set theme = '$themecolor', hex2 = '$hex' WHERE id = '" . $_COOKIE['id'] . "'";
    mysqli_query($dbc, $query);

在php方面,你需要确保值使用绑定参数(参见手册http://php.net/manual/en/mysqli-stmt.bind-param.php,我使用PDO,所以我不想在那里提供一个jenky解决方案):

compile 'uk.co.chrisjenx:calligraphy:2.1.0'

答案 1 :(得分:0)

我正在添加另外一个东西,我的另一个伙伴已经为您提供了解决方案。

如果您没有使用绑定参数,则必须使用 mysqli_real_escape_string()作为输入:

$theme = mysqli_real_escape_string($con, $_POST['theme']);
$hex2 = mysqli_real_escape_string($con, $_POST['hex2']);
$cookieID = mysqli_real_escape_string($con, $_COOKIE['id']);