jquery - 如何在 jQuery 中将 id 传递给 $.click

Question

我有以下代码

<a  href="#example" id="showtext">view text</a>

    $("#showtext").click (function () {
        $.post('/app/foo/bar/1', function (data){
           $("#msg").html(data);
        });
        $('#example').modal()
    });

当view text被点击时，我正在发出一个发布请求/app/foo/bar/1并将该数据放入一个带有 id 的 div 中#msg。所有这一切都很好，但是，现在我希望能够ids向这个 url 传递不同的内容，例如：/app/foo/bar/2或/app/foo/bar/3等。

有什么好方法可以做到这一点？

我想到的一种方法是将 id 附加到属性，如下所示：

<a href="#example" id="showtext${id}">view text</a>

然后id使用正则表达式解析出 jQuery 中的内容。但是，这种方法似乎很混乱。有没有更优雅的方法来实现这一点？

Answer 1

假设您需要href保留原样的属性，您可以使用data属性来代替。

<a href="#example" id="showtext" data-url="/app/foo/bar/2">view text</a>

$("#showtext").click(function() {
    $.post(
        $(this).data('url'), 
        function(data) {
            $("#msg").html(data);
        }
    );
    $('#example').modal()
});

或者，正如我提到的，您可以使用href：

<a href="/app/foo/bar/2" id="showtext">view text</a>

$("#showtext").click(function(e) {
    e.preventDefault(); // prevent the link being followed normally
    $.post(
        $(this).prop('href'), 
        function(data) {
            $("#msg").html(data);
        }
    );
    $('#example').modal()
});