0

嗨，我有如下的 jquery 请求，

$('#filterForm').submit(function(e){
        e.preventDefault();
        var dataString = $('#filterForm').serialize();
        var class2011 = document.getElementById("2011").className;
        //var validate = validateFilter();
        alert(dataString);
        if(class2011=='yearOn')
            {
                dataString+='&year=2011';
                document.getElementById("2011").className='yearOff';
            }
        else
            {
            document.getElementById("2011").className='yearOn';
            }

         alert (dataString);

          $.ajax({
            type: "POST",
            url: "myServlet",
            data: dataString,
            success: function(data) {
                /*var a = data;
                alert(data);*/
            }
          });

我的表格就像，

<form  method="post" name="filterForm" id="filterForm">
  <!-- some input elements -->
</form>

好吧，我在表单的提交事件上触发 jquery 提交，（它工作正常）我想在表单内部传递一个额外的参数，它不在表单内容的上方，但它在页面外部，如下所示

[查看此图片链接以获取代码预览][1]

那么我如何触发上面的事件，点击，元素类 yearOn（检查上面的 html 片段）和类 yearOff，年的附加参数设置为 2011 或 2010

4

2 回答 2

0 
$(document).ready(function () {
            $('#filterForm').submit(function (e) {
                e.preventDefault();
                var dataString = $('#filterForm').serialize();
                if ($("#2011").hasClass('yearOn')) {
                    dataString += '&year=2011';
                    $("#2011").removeClass('yearOn').addClass('yearOff');
                }
                else {
                    $("#2011").removeClass('yearOff').addClass('yearOn'); 
                }

                $.ajax({ 
                    url: "/myServlet",
                    type: "POST",                       
                    data: dataString,
                    success: function (data) {
                        /*var a = data;
                        alert(data);*/
                    }
                });
            });
});
于 2012-05-19T12:34:31.540 回答
0

1.) 如果你已经在使用 jQuery，你可以使用 jquery 提供的 $.post() 函数。在大多数情况下，它会让您的生活更轻松。

2.）我总是通过这种方式成功发布带有额外参数的帖子：

在这里为您构建额外的参数

    commands={
            year:'2011'
    };

将它与您的表单序列化结合起来

var dataString=$.param(commands)+'&'+$("#filterForm").serialize();

在此处执行您的帖子 

$.post("myServlet",data,
        function(data) {
            /*var a = data;
        alert(data);*/
    }
    );

或使用 $.ajax 如果你真的喜欢它

$.ajax({
        type: "POST",
        url: "myServlet",
        data: dataString,
        success: function(data) {
            /*var a = data;
            alert(data);*/
      }

最后，这是您现在执行的方式的完整代码

   $('#filterForm').submit(function(e){
        e.preventDefault();
        var class2011 = document.getElementById("2011").className;
        //var validate = validateFilter();
        alert(dataString);
        if(class2011=='yearOn') {
                dataString+='&year=2011';
                document.getElementById("2011").className='yearOff';
        } else {
            document.getElementById("2011").className='yearOn';
        }
         commands={
                year:'2011'
         };

         var dataString=$.param(commands)+'&'+$("#filterForm").serialize();

         alert (dataString);

          $.ajax({
            type: "POST",
            url: "myServlet",
            data: dataString,
            success: function(data) {
                /*var a = data;
                alert(data);*/
          }
    });
于 2014-01-30T17:23:45.460 回答