javascript - 处理div行中一系列href的jquery函数

Question

想象一个表(实际上由 div 构成)，其中包含行，并且在每行的最后一个单元格中，我有一个输入文本和一个链接，如下所示:

<input type="text" name="message" id="message_@Model.IncidentId" value="">
<a href="/RegisterAjax/@Model.IncidentId" id="send_@Model.IncidentId">Send a Comment</a>

在每一行(父 div)之后，我有一大块如下代码来对链接和文本输入进行 ajax 化:

$('#send_@Model.IncidentId').click(function () {
            var msg = $('#message_@Model.IncidentId').val();
            if (msg != '') { $(this).attr('href', this.href + '?msg=' + msg) }
            $.post(this.href, function (json) {
                if (json.jsonResult === null) {
                    $("#msg_@Model.IncidentId").html("Sent...");
                } else {
                    window.location.href = json.jsonResult;
                }
            });
            return false;
        });

它有效。但是，每页至少有 10 个。我要做的是将 jquery 合并为一个函数来处理所有链接。我可以使用 jquery“this”或将 IncidentId 传递给 jquery 函数或其他东西吗？似乎“this”不起作用，因为输入文本在链接之外？我怎样才能使整个页面具有一个功能？

请记住，我不必在所有内容中都加上 IncidentId。所以，如果我需要使一个或多个 id 或名称通用，那也没关系。它只需要不要对它正在处理的是什么对感到困惑。我看到一些评论说一个表单可能会有帮助，但是一个页面上有 10 个以上的表单可以吗？另外，就目前而言，除了上面显示的内容之外，永远不会有任何其他输入字段。

感谢您的帮助。谢谢。

更新:所以，我基本上在我的链接中使用了 Søren 推荐的 html5 data-* (data-id) 属性，给它一个类名，然后也将我的 url 移到了函数中...然后简单地替换了我所有的@Model.IncidentIds。一个问题是我必须使用以下内容来注册我的点击事件:

$(document).on('click', ".ajax-link", function () {

我猜是因为我使用 Handlebars 来动态生成页面？自从我将其移至评论中提到的无限滚动布局后，我就没有测试过原始功能。谢谢大家的回复。

Answer 1

试试这个:

<input type="text" name="message" data-input-id="1" value="">
<a class="ajax-link" href="#" data-link-id="1">Send a Comment</a>    

$('.ajax-link').click(function () {
        var id = $(this).attr('data-link-id');
        var msg = $('[data-link-id='+id+']').val();
        if (msg != '') { $(this).attr('href', this.href + '?msg=' + msg) }
        $.post(this.href, function (json) {
            if (json.jsonResult === null) {
                $("[data-link-id='+id+']").html("Sent...");
            } else {
                console.debug(json.jsonResult);
            }
        });
        return false;
    });

确保链接和字段具有相同的id