MYSQL表中的未定义结果

Question

我正在尝试使用ajax将信息添加到MYSQL表中。如果我直接进入插入页面它可以正常工作，但只要我通过ajax代码传递变量，输入到数据库表中的结果都表示未定义而不是给出它们的实际值。

HTML CODE

  <form action="social.php" method="POST" class="submit">
    <div id="facebook">
    <div class="row">
      <input name="facebook" type="text" id="facebook" placeholder="Add Your Facebook Link" size="50" value="<?php echo "$facebook"; ?>">
      </div>
    </div>
    <div id="twitter"><input name="twitter" id="twitter" type="text" placeholder="Add Your Twitter Link" size="50"  value="<?php echo "$twitter"; ?>"></div>
    <div id="googleplus"><input name="googleplus" id="googleplus" type="text" placeholder="Add Your Google + Link" size="50" value="<?php echo "$googleplus"; ?>"></div>
    <div id="linkedin"><input name="linkedin" type="text" id="linkedin" placeholder="Add Your Linkedin Link" size="50" value="<?php echo "$linkedin"; ?>"></div>
    <div id="socialsubmitbutton">
    <input type="hidden" name="usern" id="usern" value="<?php echo "$usern"; ?>" />
    <input type="submit" name="button" id="button" value="Submit">
    </div>
    </form>

Javascript / Ajax

   <script type"text/javascript">
    $(document).ready(function(){
$('form.submit').submit(function () {
   var usern = $(this).find('.usern').attr('value');
   var facebook = $(this).find('.facebook').attr('value');
   var googleplus = $(this).find('.googleplus').attr('value');
var linkedin = $(this).find('.linkedin').attr('value');
var twitter = $(this).find('.twitter').attr('value');
    // ...
    $.ajax({
        type: "POST",
        url: "social.php",
        data: "usern="+ usern +"& facebook="+ facebook +"& googleplus="+ googleplus +"& linkedin="+ linkedin +"& twitter="+ twitter,
        success: function(){
            $('form.submit').hide(function(){$('div.success').fadeOut();});

        }
    });
return false;
});
  });
</script>

PHP

     include 'db.php';
$usern        = htmlspecialchars(trim($_POST['usern']));
$facebook        = htmlspecialchars(trim($_POST['facebook']));
$twitter        = htmlspecialchars(trim($_POST['twitter']));
$linkedin       = htmlspecialchars(trim($_POST['linkedin']));
$googleplus        = htmlspecialchars(trim($_POST['googleplus']));


$addClient  = "INSERT INTO settings (username, facebook, googleplus, linkedin, twitter) VALUES ('$usern', '$facebook', '$googleplus', '$linkedin', '$twitter')";
mysql_query($addClient) or die(mysql_error());

Answer 1

删除参数之间的空格;

更改

data: "usern="+ usern +"& facebook="+ facebook +"& googleplus="+ googleplus +"& linkedin="+ linkedin +"& twitter="+ twitter,
                         ^--remove                ^--remove                    ^--remove                ^--remove

到

data: "usern="+ usern +"&facebook="+ facebook +"&googleplus="+ googleplus +"&linkedin="+ linkedin +"&twitter="+ twitter,

修改

并且您还需要按名称属性

查找元素

var usern = $(this).find("[name=usern]").val();
var facebook = $(this).find("[name=facebook]").val();
var googleplus = $(this).find("[name=googleplus]").val();
var linkedin = $(this).find("[name=linkedin]").val();
var twitter = $(this).find("[name=twitter]").val();

Answer 2

在这段代码中：

...
var usern = $(this).find('.usern').attr('value');
var facebook = $(this).find('.facebook').attr('value');
var googleplus = $(this).find('.googleplus').attr('value');
var linkedin = $(this).find('.linkedin').attr('value');
var twitter = $(this).find('.twitter').attr('value');
...

您正在选择类“usern”，“facebook”等实体。您实际上想要按名称选择实体，因此选择器应如下所示：

...
var usern = $(this).find("[name='usern']").attr('value');
var facebook = $(this).find("[name='facebook']").attr('value');
...

此外，如果您要检索输入的当前值，则应使用.val()而不是.attr('value')，如here所述

...
var usern = $(this).find("[name='usern']").val();
var facebook = $(this).find("[name='facebook']").val();
...

修改

我也建议，不要像这样构建你的电话：

$.ajax({
    type: "POST",
    url: "social.php",
    data: "usern="+ usern +"& facebook="+ facebook +"& googleplus="+ googleplus +"& linkedin="+ linkedin +"& twitter="+ twitter,
    success: function(){
        $('form.submit').hide(function(){$('div.success').fadeOut();});

    }
});

你这样做，因为这样更可读，更不容易出错：

$.ajax({
    type: "POST",
    url: "social.php",
    data: {
        usern : usern,
        facebook : facebook,
        googleplus : googleplus,
        linkedin : linkedin,
        twitter : twitter
    },
    success: function(){
        $('form.submit').hide(function(){$('div.success').fadeOut();});

    }
});

Answer 3

您没有正确的语法来传递数据：

data: "usern="+ usern +"& facebook="+ facebook +"& googleplus="+ googleplus +"& linkedin="+ linkedin +"& twitter="+ twitter,

成为

data: {'usern': usern,'facebook': facebook,'googleplus': googleplus, 'linkedin': linkedin, 'twitter': twitter},