web-dev-qa-db-ja.com

Jqueryにget_optionを追加する

カスタムプラグインのさまざまなラジオボタンオプションを含む設定ページを作成しました。

私が作成したラジオボタンは、yesまたはnoの値でドットを表示することです。以下のjQuery関数を除いて、いつでも値を使用できます。

以下のjQuery関数の「ドット」に使用するオプションの値を取得したいです。

jQueryスクリプト

<script type="text/javascript">
jQuery(document).ready(function(){
  jQuery('.single-item').slick({
    arrows: true,
    dots: ***OPTION VALUE HERE (true or false)***
  });
});

私が使っているラジオボタンを表示するには:

 <input type="radio" name="testimonial_bullet" id="mws_testimonial_bullet_yes" value="" checked="checked">Yes
 <input type="radio" name="testimonial_bullet" id="mws_testimonial_bullet_no" value="no" <?php if (checked( get_option('testimonial_bullet'), 'no' )); ?> />No

Get_option値を取得するために、私は使っています:

if (get_option('testimonial_bullet') == 'no') {
 // code here
}

どんな助けも大歓迎

1
rikardo85

とにかく、基本的にHody_McGeeが彼のコメントで答えを出しました:あなたは wp_localize_script() を使うことができます。コーデックスで述べているように:

[wp_localize_script()]はあなたがスクリプトで利用できるようにするために使用することができます。通常、あなたはWordPressのサーバーサイドからのみ取得できます。

どうやってこれをするのですか?

<?php
add_action( 'wp_enqueue_scripts', 'register_scripts' );
function register_scripts(){
    wp_enqueue_script( 'some_handle', 'path-to-file', array( 'jquery' ) );
    $phpInfo = array(
        'testimonial_bullet' => get_option( 'testimonial_bullet' )
    );
    wp_localize_script( 'some_handle', 'phpInfo', $phpInfo );
}
?>

あなたは自分のスクリプトをエンキューするところであなたの機能を拡張します(あなたはそれをエンキューしますよね?)。これを行った後(または登録した後)、wp_localize_script()を使用してオブジェクトをこのスクリプトに渡すことができます。ここでは、オプションの情報を含む配列$phpInfoを作成します。

スクリプトで、渡されたコンテンツを取得することができます。

jQuery(document).ready(function(){
  if( phpInfo.testimonial_bullet == 'no' )
    var d = '---';
  else
    var d = '...';

  jQuery('.single-item').slick({
    arrows: true,
    dots: d
  });
});

まあ、でも私はエンキューしない

<script>-タグが表示されているので、これを追加します。そのため、これらの情報は興味深いかもしれません。まず第一に、あなたはすべきです。その簡単で良い習慣です。 wp_enqueue_script() を見てください。それでもなお、header.phpまたはfoorter.phpに記述したほうがよい場合があります。そうする理由である。この場合、あなたは単にこのような情報を検索することができます:

<script>
    jQuery(document).ready(function(){
      if( '<?php echo get_option( 'testimonial_bullet' ); ?>' == 'no' )
        var d = '---';
      else
        var d = '...';

      jQuery('.single-item').slick({
        arrows: true,
        dots: d
      });
    });
</script>
4
websupporter