如何让ASP.NET Core中ValidationSummary的列表项关联到表单字段？

完全可以实现，下面是几种落地方案，兼顾自定义灵活性和工具简化，同时满足无障碍要求：

一、自定义JS实现（最灵活，无依赖） #

WebForms原生的ValidationSummary不会自动生成指向字段的锚点，所以需要在验证触发后动态修改错误项：

1. 前置准备

   • 给每个表单字段设置唯一id，所有验证器的ControlToValidate正确指向对应字段id，同时把验证器的Display="None"（让错误只在Summary中显示）。

2. 核心JS代码

function wireValidationSummaryLinks() {
    const summary = document.querySelector('.validation-summary-errors');
    if (!summary) return;

    // 构建错误文本与目标字段的映射
    const errorMap = {};
    document.querySelectorAll('[data-valmsg-for]').forEach(validator => {
        const fieldId = validator.getAttribute('data-valmsg-for');
        const errorText = validator.textContent.trim();
        if (errorText) errorMap[errorText] = fieldId;
    });

    // 替换错误项为跳转链接
    summary.querySelectorAll('li').forEach(item => {
        const text = item.textContent.trim();
        const targetId = errorMap[text];
        if (!targetId) return;

        const link = document.createElement('a');
        link.href = `#${targetId}`;
        link.textContent = text;
        // 点击后聚焦到字段（比单纯跳转更友好）
        link.addEventListener('click', e => {
            e.preventDefault();
            document.getElementById(targetId).focus();
        });
        // 无障碍属性：告知屏幕阅读器链接用途
        link.setAttribute('aria-label', `跳转到错误字段：${text}`);
        
        item.innerHTML = '';
        item.appendChild(link);
    });
}

// 绑定到WebForms客户端验证事件
if (typeof Page_ClientValidate === 'function') {
    const originalValidate = Page_ClientValidate;
    Page_ClientValidate = function(validationGroup) {
        const result = originalValidate(validationGroup);
        wireValidationSummaryLinks();
        return result;
    };
}

// 页面加载时处理服务器端返回的错误
window.addEventListener('load', wireValidationSummaryLinks);

这段代码会在客户端验证完成、或页面加载（处理服务器端错误）时，自动把Summary里的错误项转换成带跳转功能的链接，点击后直接聚焦到对应字段，同时满足508的无障碍要求。

二、现成工具简化实现 #

如果不想手写JS，可以考虑：

• jQuery Validation插件：可以替换WebForms原生验证，通过showErrors方法自定义错误汇总的渲染逻辑，直接生成带锚点的错误项，内置基础无障碍支持。
• ASP.NET Ajax Control Toolkit：其中的ValidatorCalloutExtender可以增强验证体验，配合少量JS就能实现Summary项到字段的跳转，且工具包本身对508合规做了优化。

三、508合规关键细节 #

• 必须保证链接点击后聚焦到对应字段，而非仅页面跳转，方便键盘用户操作。
• 给跳转链接添加aria-label属性，让屏幕阅读器能识别链接的用途。
• 错误字段需设置aria-invalid="true"，并通过aria-describedby关联对应的错误信息。
• 确保所有错误链接可通过键盘遍历（默认<a>标签自带tab可访问性，无需额外设置）。

内容的提问来源于stack exchange，提问作者L. Wallach