如何在 jquery 发布请求中从外部点击事件传递额外的参数

How to pass extra parameter in jquery post request from outside click event?

本文关键字：事件 参数 从外部 jquery 布请求 请求      更新时间：2023-09-26

嗨，我有如下所示的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 ，并将 year 的附加参数设置为 2011 或 2010

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

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);*/
          }
    });
相关文章：