HTML，是否可以从“必需”属性更改验证消息位置？答案

【问题标题】：HTML, Is it possible to change validation message location from the "required" attribute?HTML，是否可以从“必需”属性更改验证消息位置？
【发布时间】：2016-08-10 11:03:57
【问题描述】：

我有一个带有不同语言的选项卡式模式。我希望我的 2 种语言的每个 title 和 text 都是必需的，但是当我专注于一个选项卡时，来自另一个选项卡的验证消息会弹出到左上角由于某种原因，屏幕角落。

（抱歉，当我尝试截图时，验证消息消失了，但我想你明白我在说什么）

所以我的模态如下：

现在我想做的是，当我专注于 English 选项卡并单击 Save 但希腊语字段为空时，我希望验证消息出现在希腊语标签链接上，而不是屏幕左上角（无论出于何种原因都会出现这种情况）

例如，我可以使用 jQuery 执行以下操作吗：

$('#myElement').attr("required").location = ???

这可能吗？如果没有，我该如何处理？

任何帮助，建议非常感谢。

【问题讨论】：

寻求代码帮助的问题必须包含重现它所需的最短代码在问题本身中最好在Stack Snippet 中。见How to create a Minimal, Complete, and Verifiable example
@Paulie_D 感谢您的建议。我添加了一行代码，这是我认为唯一可以得出答案的代码。老实说，这里没什么可补充的，更多的是关于这是否可能。

标签： javascript jquery html css validation

【解决方案1】：

你可以这样做

示例：https://jsfiddle.net/wakirin/nfoqacyy/

$('#btn-save').click(function(e){
    e.preventDefault();
  var inputs = 0;
  $.each($('.tab-pane'), function(k,v){
    inputs = $(v).find('input:required').filter(function() {return !this.value.length;}).length + $(v).find('textarea:required').filter(function() {return !this.value.length;}).length;

        $('a[aria-controls="'+$(v).attr('id')+'"]').removeAttr('style');

    if (inputs > 0) {
        $('a[aria-controls="'+$(v).attr('id')+'"]').css({color: '#a94442'});
    }
  });
  if (inputs == 0) {
    alert('OK!');
  }
})

【讨论】：