javascript - 如何将参数从链接传递到jquery方法

Question

当用户单击链接时，我需要触发 JQuery 方法，并调用位于/Project/Send/SendMethod. 当我单击send该方法被触发的链接时，我知道这一点，因为正在显示警报。但问题是如何调用网络服务。如果是POST方法就好了。

<a href='' id='2' class='send'> Send  </a>

jQuery方法

   $(function () {
        $('.send').click(function () {
            alert(this.id);

        });
    });

Answer 1

您可以$.ajax()在 jQuery 中使用 api。此外，您必须阻止默认链接中的默认行为。否则，您将更改页面而不是发送 ajax 请求。

$('.send').click(function (event) {
    event.preventDefault();
    $.ajax( {
        url:"Project/Send/SendMethod",
        type: "POST",
        data: { "id": this.id },
        success:function(data) {
            alert(data);
        }
    });
});

如果您使用的是 jQuery 1.8+，因为从 jQuery 1.8 开始不推荐使用“成功”回调。您应该使用“完成” http://api.jquery.com/deferred.done/

$('.send').click(function (event) {
    event.preventDefault();
    $.ajax( {
        url:"Project/Send/SendMethod",
        type: "POST",
        data: { "id": this.id }
    }).done(function( data) {
        alert(data);
    });
});

Answer 2

使用$.ajax()方法并指定 URL 和选项，如 jQuery Ajax

$(function() {
    $('.send').click(function (e) {
        e.prevenDefault();
       $.ajax({
          url: "Project/Send/SendMethod",
          type: "POST",
          data: values,
          success: function(){
                  alert("success");
                  $("#result").html('submitted successfully');
          }
       });
    });
});

Answer 3

使用 jQuery $.post：

 $(function () {
    $('.send').click(function () {
        alert(this.id);
        $.post(url, {'id':this.id}, function (response) {
            //do the result oriented activities
        });
    });
});

Answer 4

我会使用 jQuery 的ajax()功能（并且经常这样做）。

下面的示例假设您将获得 JSON 格式的响应。如果您要返回一个完整的 HTML 页面，您可以更改此设置...查看http://api.jquery.com/jQuery.ajax/了解更多信息。

$(function () {
    $('.send').click(function (e) {
        e.stopPropagation();
        e.preventDefault();
        var thisId = $(this).attr('id');
        alert(thisId);
        var hostAndPort = window.location.protocol + "//" + window.location.hostname + ":" + window.location.port; // current page and protocol (http or https)
        var requestUrl = hostAndPort + "/Project/Send/SendMethod/";
        var str_address = requestUrl + 'id?=' + thisId;
        $.ajax({
            url: str_address,
            contentType: 'application/json',
            dataType: 'JSON',
            type: 'POST',
            success: function (response) {
                console.log(response);
                // do something...
            },
            error: function (e) {
                // handle error
            }
        });
    });
});