0

jqueryを更新するプラグインオプションを追加しようとしていますが、その方法がわかりません。wp_enqueue_script()を使用してjqueryを追加しているため、php関数(get_option())をjqueryコードに追加できません。これを解決するのを手伝ってください。

Jqueryコード:

jQuery(document).ready(function(){

    $cnt = 0;

    jQuery('#add-photo-button').click(function(){

    if($cnt == 3){ // where 3 should replaced with plugin option function/varible
        jQuery('#add-photo-button').prop('disabled', true);
        jQuery('#add-photo-button').addClass('disabled');
    }
    $cnt++;
        var current_count = jQuery('input[type="file"]').length;
        //var next_count = current_count + 1;

        jQuery('#file-upload').prepend('<p><input type="file" name="photo[]" /></p>');    

    });  

});
4

1 に答える 1

1

wp_localize_script()関数を参照してください。

スクリプトをキューに入れてから、JavaScriptで参照するデータをローカライズ(またはインラインJavaScriptとして渡す)し、最後にスクリプトを更新して、新しくローカライズされたグローバルオブジェクトを参照する必要があります。以下の私の例をご覧ください。


1-スクリプトをプラグインにエンキューし、を使用して変数データを「ローカライズ」しますwp_localize_script()。両方の関数呼び出しに同じハンドルを使用するようにしてください。

<?php

// !! Edit the variables below to suit your plugin

$add_photo_button_handle = 'some_handle';
$add_photo_button_js = plugins_url( '/add_photo_button.js', __FILE__ );

$photo_num = get_option( 'add_photo_button_cnt' ); // Here you fetch the option data.

// Enqueue your script
wp_enqueue_script( $add_photo_button_handle, $add_photo_button_js );

// Set the data you want to pass to your script here
$data = array( 'photo_button_cnt' => $photo_num );

// Localize the script, the 'photo_button_cnt' value will now be accessible as a property in the global 'add_photo_button' object.
wp_localize_script( $add_photo_button_handle, 'add_photo_button', $data );
?>

2-ローカライズされたオブジェクトを参照するようにスクリプトを変更します

<script type="text/javascript">
jQuery(document).ready(function(){

    $cnt = 0;

    jQuery('#add-photo-button').click(function(){

    //============================================
    // See how we access the localized object.
    //============================================

    if($cnt == add_photo_button.photo_button_cnt ){ 
        jQuery('#add-photo-button').prop('disabled', true);
        jQuery('#add-photo-button').addClass('disabled');
    }
    $cnt++;
        var current_count = jQuery('input[type="file"]').length;
        //var next_count = current_count + 1;

        jQuery('#file-upload').prepend('<p><input type="file" name="photo[]" /></p>');    

    });  
});
</script>
于 2013-02-19T16:39:24.377 に答える