创建样式表切换器实时预览WP定制器

Question

背景故事：

我使用原生WordPress定制器创建了样式表切换器。我有定制器正常运行并通过PHP保存新的样式表选择，但对于通过.js / jQuery的实时预览，我遇到了问题。希望你能给我一些指示，仍然是.js和jQuery的新手。

我的问题

当我从下拉列表中选择一个方案并在自定义程序中单击“发布”，然后刷新，我的更改出现，所以我在PHP方面很好，但是当我在WP Customizer实时预览iframe中进行选择时，我的更改根本没有出现。

当我进入控制台时，我可以看到我选择的方案已经选择了我选择的样式表的正确URL路径，但屏幕上没有任何内容。

我的.js / jQuery：

wp.customize( 'my_scheme_switch', function( value ) {
value.bind( function( to ) {
var zScheme;

    if ( 'default' === to ) {

        zScheme = 'default.css';

    } else if ( 'orange' === to ) {

        zScheme = 'orange.css';

    } else {

        zScheme = 'default.css';

    }

    jQuery( document ).ready( function($) {
        var $body = $( 'body' );
        var $head = $( 'head' );

        var $switcher = $('#my-style-switcher-css', $head );
        var schemes = '/wp-content/themes/mytheme/css/schemes/';
        var newStyle = location.protocol + "//" + location.host + schemes + zScheme;
        $switcher.href = newStyle;
    });  
});
});