0

友人の WordPress サイト用に作成したフォームの動的フォーム検証が必要です。フォーム プラグインを使用したので、今後も簡単に使用できます。

他のフィールドからの入力に基づいて、特定のフィールドを条件付きで必須にする必要があります。たとえば、ある人がペットを飼っているチェックボックスで「はい」をチェックした場合、他のペット関連のフィールドが必要になり、自分自身も非表示にする必要があります。入力値が変更されたときにクラスを追加/削除するだけでこれを行いたいです。

プラグインが原因で、サイトのチェックボックスが非常に大きくネストされており、チェック ボックスの値にアクセスする方法を理解するのに苦労しています。

以下のコードが面倒な場合は jsFiddle -> http://jsfiddle.net/ebgranger/cjsg2/3/

HTML

<p>Do you currently have pets?
        <br /> <span class="wpcf7-form-control-wrap checkbox-243"><span class="wpcf7-form-control wpcf7-checkbox wpcf7-validates-as-required petsCheckBox"><span class="wpcf7-list-item"><input type="checkbox" name="checkbox-243[]" value="Yes" />&nbsp;<span class="wpcf7-list-item-label">Yes</span></span><span class="wpcf7-list-item"><input type="checkbox" name="checkbox-243[]" value="No" />&nbsp;<span class="wpcf7-list-item-label">No</span></span>
        </span>
        </span>
    </p>

jQuery

$('.checkbox-243 .wpcf7-checkbox .wpcf-list-item input').blur(function () {
if (this:checkbox:checked = "Yes") { 
    $(this).parents('p').addClass('red');
} else if (this:checkbox:checked == "No") {
    $(this).parents('p').removeClass('red');
} 
});

このコードはうまく機能していません。これをどのように機能させたいかについてのロジックはわかっていますが、jQuery 構文についてもっと学ぶ必要があります。

4

1 に答える 1

0

チェックボックスを対象とする構文が間違っています。

最初に取得するために使用findします。

また、チェックされたプロパティはブール値です..文字列ではありません 

if ( $(this).find('checkbox').is(':checked')) {
    // Add class
} else {
   // remove class
}

アップデート

$('.checkbox-243 .petsCheckBox input[value="Yes"]').change(function () {
    var $this = $(this);
    if ( $this.is(':checked')) {
        $this.closest('p').addClass('red');
    } else {
        $this.closest('p').removeClass('red');
    }
});

フィドルをチェック

于 2013-08-03T21:13:41.997 に答える