Javascript MYSQL表中未定义的结果

我正在尝试使用ajax向MYSQL表添加信息。如果直接转到insert页面，效果会很好，但是只要我通过ajax代码传递变量，输入到数据库表中的结果都是未定义的，而不是给出它们的实际值

HTML代码

  <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>

---

删除参数之间的空格

改变

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

到

编辑

还需要通过元素的name属性查找元素

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();

---

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

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

变成

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

在这段代码中：

...
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');
...

$.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();});

    }
});

此外，如果要检索输入的当前值，应使用

.val（）

而不是

.attr（'value'）

，如前所述

编辑：

我也建议，不要像这样构建您的呼叫：

...
var usern = $(this).find("[name='usern']").attr('value');
var facebook = $(this).find("[name='facebook']").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();});

    }
});

您可以这样做，因为这样更具可读性，更不容易出错：

$.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();});

    }
});

---

确保您在

find（）

中有

“

引号。您是否尝试过使用

var usern=$（'#usern'）.val（）；var facebook=$（'#facebook'）.val（）；var googleplus=$（'#googleplus'）.val（）；var linkedin=$（'#linkedin'）.val（）；var twitter=$（'#twitter'）.val（）

好的，我尝试了编辑，如果我使用第一个，它仍然表示未定义，如果我使用第二个，那么表中没有输入任何内容啊，最后我遇到了问题。您使用了多个ID。这是无效的。因此，您可能需要通过元素名称本身查找元素。无论如何，我已经更新了答案。

$.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();});

    }
});