0

我想做这个。

<p class="validator">This is an error!</p>
<input type="text" validator="isGoodValue" value=""/>

<p class="validator">This is an error 2!</p>
<label>
<input type="text" validator="isGoodValue" value=""/></label>

<div><p class="validator">This is an error 3!</p></div>
<label>
<input type="text" validator="isGoodValue" value=""/></label>    

<script>
$('input').change( function() {
 if (!isGoogValue( $(this).val() )) {
     $(this).GET_ME_THE_VALIDATOR_ABOVE_ME().show();
 }
 else {
     $(this).GET_ME_THE_VALIDATOR_ABOVE_ME().hide();
 }
});
</script>

获取确切信息的 GET_ME_THE_VALIDATOR_ABOVE_ME 代码可能是什么

上面的验证器，独立于 HTML 结构？或者 jQuery 的什么功能做这个工作......？？？

我正在尝试使用最接近的，父级，上一个.. 但这效果不佳。

4

2 回答 2

2

尝试这个

 if (!isGoogValue( $(this).val() )) {
     $(this).prevAll('.validator:first').show();
 }
 else {
     $(this).prevAll('.validator:first').hide();
 }
于 2013-01-03T14:22:31.600 回答
1

真正的解决方案是拥有一些一致的结构，这样您的错误消息就不会与您的输入完全断开，然后您可以使用类似于 Anton 建议的解决方案。

或者，如果绝对不可能将您的 HTML 重构为理智的东西，您可以为您的所有输入提供 ID，并为您的错误消息提供 ID，这些信息可能以某种方式相关。例如，输入 1 的 ID 为input1，其对应的错误为input1error。然后你可以做这样的事情：

$('input').change( function() {
     if (!isGoodValue( $(this).val() )) {
         var id = $(this).attr("id");
         $("#" + id + "error").show();
     }
     else {
         var id = $(this).attr("id");
         $("#" + id + "error").hide();
     }
 });

看到这个小提琴。

现在，您的错误出现在哪里并不重要，只要它们可以通过它们的 id 以某种方式关联即可。

此小提琴中显示的另一个解决方案假设第 n 个输入对应于第 n 个验证器，如下所示：

$('input').each(function(index, elem) {
    var idx = index;
    $(elem).change(function() {
        var val = $('.validator').eq(idx);
        if (!isGoodValue( $(this).val() )) {
            val.show();                
        }
        else {
            val.hide();
        }
    });            
});
于 2013-01-03T14:59:56.293 回答