2

我没有代码可以在这里真正向您展示，但是假设我有一个包含 3 个隐藏字段的表单，其中包含日期、城市和地址。我还有一个带有 3 个选项的选项（比如说 Apple、Microsoft 和 Google）。

我想要的是，当用户将选择更改为不同的选项时，jquery 应该将选择框的值 + 3 个隐藏字段发送到 PHP 页面，比如 proces.php。Proces.php 处理 mysql_query 等，它不返回任何东西。

谁能告诉我这是怎么做到的？我不希望任何人为我编写完整的脚本，因为我没有提供任何 html 代码，而只是提供大纲，或者可能是指向教程或其他内容的链接。

4

4 回答 4

7

首先，您的表单应如下所示：

<form action="process.php" method="post" id="myForm">
    <select name="site" id="site">
        <option>Apple</option>
        <option>Google</option>
        <option>Microsoft</option>
    </select>
    <input type="hidden" name="date" value="01/05/2012" />
    <input type="hidden" name="city" value="London" />
    <input type="hidden" name="address" value="[... address ...]" />
</form>

然后通过 AJAX 提交，您将使用该serialize()方法收集表单数据：

$("#site").on("change", function() {
    var $form = $("#myForm");
    var method = $form.attr("method") ? $form.attr("method").toUpperCase() : "GET";
    $.ajax({
        url: $form.attr("action"),
        data: $form.serialize(),
        type: method,
        success: function() {
            // do stuff with the result, if you want to 
        }
    });
});

或者如果你不想使用AJAX，只是标准的表单提交，你可以触发表单提交，像这样：

$("#site").on("change", function() {
    $("#myForm").submit();
});
于 2012-05-01T13:02:46.643 回答
1 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<form id="form1" name="form1" method="post" action="#">
    <label for="brand">Brand</label>
    <select name="brand" id="brand">
        <option>Apple</option>
        <option>Microsoft</option>
        <option>Google</option>     
    </select>
    <input type="hidden" name="date" id="date" value="7/4/1776" />
    <input type="hidden" name="city" id="city" value="My City"  />
    <input type="hidden" name="address" id="address" value="123 Fake Street" />
</form>
<script type="text/javascript" src='//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script type="text/javascript">
    $('#brand').on('change',function() {
        $.post("process.php", $("#form1").serialize());
    });
</script>
</body>
</html>
于 2012-05-01T13:07:46.613 回答
1

如果你想使用 jquery 发送表单，你可以使用 Jquery Form plugin<
http://jquery.malsup.com/form/ 所以基本上你可以做的是使用

$(document).ready(function(){
$('form selector').ajaxForm(opts);
//u can define the opt urself itz easy look at the link
$("selects selector").change(function(){
$(form selector).ajaxSubmit(function(){//something you wanna do if form is submitted successfully})
});
});
于 2012-05-01T13:03:25.277 回答
1

看看，原来是个form，是在下拉select改变的时候提交的？你真的不需要为此使用 AJAX。您可以像这样使用 jquery .change() 方法：

$('.mydropdown').change(function() {
  // Also do some checking to see if the values are not empty 
  // and then submit the form using:
  $('#myform').submit();
});

在 php 文件中，您可以使用 $_POST 变量获取它们。

于 2012-05-01T13:04:57.937 回答