Question

好吧，我有这两个输入字段，用户输入两个Twitter名称。按下提交按钮时，应使用POST方法将这两个名称发送到.php文件，该方法检查两个用户名是否存在于Twitter上。

发送和接收一个值的答案已经有效，但我怎样才能添加第二个？我已经有了这个：

<script type="text/javascript">
function checkUsername()
{

    $.ajax({
        type: 'POST',
        url: 'tu.php',
        **data: {'user1' : $('#user1').val() },** //how to append user2?
        dataType: "json",
        success: function(data){
            $('#uitslag').html(JSON.stringify(data)); 
            $('#user1text').html(data['user1']);
            $('#user2text').html(data['user2']);
        }
    });
}
</script>

表单中的字段：

    <td><input type="text" name="user1" id="user1"/></td>
    <td><input type="text" name="user2" id="user2" /></td>

这就是这些值应该如何在.php中加入：

$user1 = $_POST['user1'];
$user2 = $_POST['user2'];

所以问题实际上是：如何将第二个用户名附加到上面的jQuery POST函数？

P.S。我开始使用javascript和jQuery，你们如何使用它，因为没有显示任何错误消息..是否有一个环境/程序，我可以通过javascript获得调试帮助？

Answer 1

data: {
     'user1' : $('#user1').val(), 
     'user2' : $('#user2').val()
},

Answer 2

这是一个简单的扩展 - 只需遵循相同的模式。

<script type="text/javascript">
function checkUsername()
{

    $.ajax({
        type: 'POST',
        url: 'tu.php',
        data: {
            'user1' : $('#user1').val(),
            'user2' : $('#user2').val()
        },
        dataType: "json",
        success: function(data){
            $('#uitslag').html(JSON.stringify(data)); 
            $('#user1text').html(data['user1']);
            $('#user2text').html(data['user2']);
        }
    });
}
</script>

也就是说，jQuery还有一个.serialize()函数可以在包含的表单上应用，它会自动序列化整个表单。这可能对你有用。

编辑：值得一提的是，上面的jQuery选择器在 id 上查找名称“user1”（等），而PHP脚本需要表单元素'名称为“user1”（等）。在这里，你有同样的东西。

一个更可靠的jQuery选择器，允许你总是在jQuery和PHP中使用这个名称，只是在jQuery中使用一个属性选择器：

$('input[name="user1"]').val()

这将捕获<input>元素设置为“user1”的任何name元素。

Answer 3

你可能正在寻找serialize。您的代码看起来像这样：

function checkUsername()
{

    $.ajax({
        type: 'POST',
        url: 'tu.php',
        data: $("#your_form").serialize(),
        dataType: "json",
        success: function(data){
            $('#uitslag').html(JSON.stringify(data)); 
            $('#user1text').html(data['user1']);
            $('#user2text').html(data['user2']);
        }
    });
}

如果您确定不想序列化，可以试试这个：

data: {'user1' : $('#user1').val(), 'user2' : $('#user2').val() }

关于您的PS，请查看Firebug和Webkit developer tools。

Answer 4

您实际上甚至不需要序列化功能。如果您只选择表单，则将传递所有表单元素。这样，如果您只是添加另一个表单元素，就像另一个文本框一样，它将全部通过您的ajax调用传递。

function checkUsername()
{

    $.ajax({
        type: 'POST',
        url: 'tu.php',
        data: $("#your_form"),
        dataType: "json",
        success: function(data){
            $('#uitslag').html(JSON.stringify(data)); 
            $('#user1text').html(data['user1']);
            $('#user2text').html(data['user2']);
        }
    });
}

如何使用jQuery发送两个输入

4 个答案: