使用wp.Customize使用JavaScript更改整个控件选项

时间：2017-05-14 作者：5ervant - techintel.github.io

假设我有两个自定义控件“setting\\u category”和“setting\\u font”，我试图在更改“setting\\u category”的值时更改“setting\\u font”的选择。下面是我正在做的：

( function( $ ) {
    var api = wp.customize;

    api( \'setting_category\', function( value ) {
        value.bind( function( to ) {
            var newChoices = {};
            // get new data from JSON using \'to\' and populate the \'newChoices\'

            api( \'setting_font\' ).changeTheChoices( newChoices );
        } );
    } );
} )( jQuery );
如何使用JavaScript实现？有什么把戏吗？

2 个回复
最合适的回答,由SO网友:5ervant - techintel.github.io 整理而成

以下是我找到的解决方案，在某些情况下可能很有用：

parent.wp.customize.control( \'setting_category\', function( control ) {
    control.setting.bind( function( to ) {
        var selectElem = parent.wp.customize.control( \'setting_font\' ).container.find( \'select\' );

        selectElem.empty();
        $.each( jsonData[\'items\'], function( key, item ) {
            if ( item[\'category\'] === to ) {
                var option = $( \'<option></option>\' )
                        .attr( "value", encodeURIComponent( item[\'family\'] ) )
                        .text( item[\'family\'] );
                selectElem.append( option );
            }
        } );
    } );
} );

SO网友:Weston Ruter

你很接近了。你只需要更换changeTheChoices() 具有set() 因为这是wp.customize.Setting. 请参见以下内容，其中也进行了一些重构：

wp.customize( \'setting_category\', \'setting_font\', function( categorySetting, fontSetting ) {
    categorySetting.bind( function( category ) {
        var newChoices = {};
        // get new data from JSON using \'category\' and populate the \'newChoices\'

        fontSetting.set( newChoices );
    });
});
提示：我建议不要使用“setting“在您设置的ID中。

结束
标签： theme-development   ajax   javascript   theme-customizer   json   小码农  

相关推荐

在AJAX插入后初始化TinyMCE编辑器/可视化编辑器

我在自定义选项页面上有一个“repeater”样式的字段组。有一个处于隐藏状态的活动可视化编辑器，当用户单击“添加新内容”时，整行将被克隆。然后，我需要初始化克隆行中的可视化编辑器。我的代码：$(\'.repeater-add-new\').click(function(event) { event.preventDefault(); var target = $(this).data(\'repeater\'); $( \'#\' + target).fi