0

マークアップが有効な HTML5 として検証されるように、直接属性ではなくデータ属性 (例: minlength の代わりに data-minlength、equalTo の代わりに data-equalTo) を使用するように jQuery Validator プラグインを接続しようとしていました。data-equalTo に到達するまで、すべてがうまく機能していました。代わりに data-equals を使用し、コードに特別な条件を追加する必要がありました。

$("#form").validate();
['minlength', 'maxlength', 'range', 'min', 'max', 'equals' /* 'equalTo' no worky! */].forEach(function (item) {
    $('input[data-' + item + ']').each(function () {
        if ($(this).data(item)) {
            var rule = {};
            if (item == 'equals') /* special condition because 'equalTo' never makes it into this if block */
                rule['equalTo'] = $(this).data(item);
            else
                rule[item] = $(this).data(item);
            $(this).rules("add", rule);
        }
    });
});

問題は$('input[data-' + item + ']')セレクターにあるようでした。何らかの理由で、data-equalTo を選択していませんでした。予約されていますか、何らかの理由で jQuery 経由で選択できませんか?

現在、Yoshi のフィードバックに基づいて作業しています。

['minlength', 'maxlength', 'range', 'min', 'max', 'equalTo'].forEach(function (item) {
    $('input[data-' + item + ']').each(function () {
        var lowerItem = item.toLowerCase();
        if ($(this).data(lowerItem)) {
            var rule = {};
            rule[item] = $(this).data(lowerItem);
            $(this).rules("add", rule);
        }
    });
});
4

1 に答える 1

2

jquery を使用すると、小文字のデータ属性にアクセスする必要があります。あなたの場合：

$(somelement).data('equalto');

それが望ましくない場合は、試してくださいattr

$(somelement).attr('data-equalTo');

ただし、その場合、jquery からの自動解析は得られません。

デモ: http://jsfiddle.net/BS6wy/1/

<div id="foo" data-equalTo="42"></div>​

<script>
  console.log(
    $('#foo').data('equalTo'), // undefined
    $('#foo').data('equalto'), // 42 (as number)
    $('#foo').attr('data-equalTo')  // "42" (as string)
  );​
</script>
于 2012-08-13T17:15:46.643 に答える