0

現在、私のフォームは次のルールを使用して完全に機能しており、フォーム入力の右側に緑色のチェックマークまたは赤色のエラーメッセージのラベルを追加しています:

highlight: function(label) {
            $(label).closest('.form-element').addClass('error')
            .closest('.form-element').removeClass('success');;
        },
        success: function(label) {
            label
            .text('OK!').addClass('valid')
            .closest('.form-element').addClass('success');
        },

関連する CSS は次のとおりです。

#jqvForm label.valid {
  width: 16px;
  height: 16px;
  background: url("../images/tick.png") center center no-repeat;
  display: inline-block;
  text-indent: -9999em !important;
  position: absolute;
}
#jqvForm label.error {
  color: red;
  display: inline;
  float: none;
  font-size:11px;
  font-weight: bold;
  margin-left: 10px;
  text-align: left;
  padding: 2px 8px;
  margin-top: 2px;
}

ただし、ページには、ユーザーが利用規約に同意する必要があるチェックボックスが 1 つあります。エラーメッセージやチェックマークを横に置くと、本当に見栄えが悪くなります。

チェックボックスに別のハイライト/成功関数を設定する検証方法はありますか? または、この 1 つのボックスに対して検証を使用せず、代わりに別のものを使用してボックスがチェックされていることを確認する方がよいでしょうか?

4

1 に答える 1

1

オプションのドキュメントから、 ハイライトをオーバーライドして、どのフィールドとどのようにハイライトするかを決定すると書かれているため、t + cチェックボックスにクラス「myCheckbox」がある場合、次のようなことができます

success: function (label) {
    if (label.hasClass('myCheckbox')) {
        // do something with the checkbox
    }
    else {
        // do something with other fields
    }
},
highlight: function (element, errorClass) {
    var v = $(element);
    if (v.hasClass('myCheckbox')) {
        // do something with the checkbox
    }
    else {
        // do something with other fields
    }
}
于 2012-12-19T10:59:26.763 に答える