我是jQuery的新手，所以我刚刚复制了代码：
<div id="container">
<input type="text" id="name" placeholder="Type here and press Enter">
</div>
<div id="result"></div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#name').focus();
$('#name').keypress(function(event) {
var key = (event.keyCode ? event.keyCode : event.which);
if (key == 13) {
var info = $('#name').val();
$.ajax({
method: "POST",
url: "action.php",
data: {name: info},
success: function(status) {
$('#result').append(status);
$('#name').val('');
}
});
};
});
});
</script>
这是php代码：
<?php
if (isset($_POST['name'])) {
echo '<h1>'.$_POST['name'];
}
?>
它工作得很好，但现在我想有不止一个这样的输入字段：
<input type="text" id="name" >
<input type="text" id="job">
但我不知道如何为这两个输入字段运行jQuery代码，以便将它们传输到php页面。请帮助
您可以像这样使用ajax请求的data参数传递多个值。
$.ajax({
method: "POST",
url: "action.php",
data: {
name: $('#name').val(),
job: $('#job').val()
},
success: function(status) {
$('#result').append(status);
$('#name, #job').val(''); // Reset value of both fields
}
});
您需要通过添加html和JS来更改代码。将您的输入包装在form标签中。并在提交时添加preventDefault。使用jQuery.serialize（）方法和event.prventDefault（）
-
event.preventDefault()：如果调用此方法，则默认事件的操作将不会被触发。（它将阻止页面重载/重定向）到任何页面。 -
.serialize()：将一组表单元素编码为
的字符串屈服
序列化字符串输出将类似于key=value对，&分开。：
name=john&job=developer.....
HTML
<form id="myform">
<input type="text" id="name" placeholder="Type here and press submit">
<input type="text" id="job" placeholder="Type here and press submit">
<input type="submit" name="submit" value="Submit Form">
</form>
JS
$(document).ready(function() {
$('#myform').submit(function(event) {
event.preventDefault();
var serialized = $('#myform').serialize();
$.ajax({
method: "POST",
url: "action.php",
data: serialized,
success: function(status) {
$('#result').append(status);
$('#myform').reset();
}
});
});
});