web-dev-qa-db-ja.com

テーマカスタマイザで検証を行うためにjqueryコードをロードする方法

テーマカスタマイザで検証を行うためにいくつかのjqueryコードをロードしようとしています。私はいくつかの情報を表示するために10のチェックボックスを作成しました。しかし、私はユーザーが5つのチェックボックスだけを選択するように制限したいです。それで私はそうするためにjqueryコードを作成しました、そして私がクロムコンソールにこのコードを入れるとき、このコードはうまく働きます。

jQuery(document).ready(function($){ 
$("#section id input[type=checkbox]").click(function(){
    var countchecked = $("#section id input[type=checkbox]:checked").length;

    if(countchecked >= 2) 
    {
        $('#section id input[type=checkbox]').not(':checked').attr("disabled",true);
    }
    else
    {
        $('#section id input[type=checkbox]').not(':checked').attr("disabled",false);
    }
});
});

私が逃したことは何ですか？ユーザーがcustomize.php（テーマカスタマイザ）を使用するときにいくつかのjqueryコードをロードするfunctions.phpに挿入するために使用する必要があるコーデック？

ユーザーがすべての変更を保存しようとする前に、すべての検証を行いたいです。

手伝ってくれてありがとう。

functionsjqueryvalidationtheme-customizer
2
someone

テーマディレクトリに/jsサブフォルダがまだ存在しない場合は作成します。
あなたのスクリプトをそのフォルダ内のファイルに保存してください。

それから、functions.php：

if ( is_admin() ) {
    global $pagenow;

    if ( 'customize.php' === $pagenow ) {
        add_action( 'admin_enqueue_scripts', 'wpse107236_enqueue_customizer_script' );
    }
}

function wpse107236_enqueue_customizer_script() {
    wp_enqueue_script(
        'your-script-handle',
        get_template_directory_uri . '/js/your-script.js',
        array( 'jquery' ),
        '1.0',
        true
    );
}

関連リソース：

1
Johannes Pille