由于自定义 js 文件，编辑器的工具栏丢失

Question

我在主页上为轮播添加了一个自定义 js 文件 cr-scroll.js。添加后，页面的编辑器工具栏不见了。如果我删除那个 js 文件，那么一切正常。

这个 js 文件有什么问题？任何帮助将不胜感激。提前致谢。

编辑：

我已经使用以下代码添加了脚本：

wp_register_script('java1', get_template_directory_uri() . '/js/cr-scroll.js?version=4.2', array( 'jquery' ));
wp_enqueue_script( 'java1' );

我的cs-scroll.js:

var $k = jQuery.noConflict();
(function($k){
$k(document).ready(function($k) {
 $k.fn.make_carousel = function() {
    var speed = 0;
    var scroll = 0;
    var con = $k(this);
    var con_w = con.width();
    var max_scroll = con[0].scrollWidth - con.outerWidth();
    var prev_frame = new Date().getTime();
    con.on('mousemove', function(e) {
        var mouse_x = e.pageX - con.offset().left;
        var mouseperc = 100 * mouse_x / con_w;
        speed = mouseperc - 50;
    }).on ( 'mouseleave', function() {
        speed = 0;
    });

    function updatescroll() {
        var cur_frame = new Date().getTime();
        var time_elapsed = cur_frame - prev_frame;
        prev_frame = cur_frame;
        if (speed !== 0) {
            scroll += speed * time_elapsed / 50;
            if (scroll < 0) scroll = 0;
            if (scroll > max_scroll) scroll = max_scroll;
            con.scrollLeft(scroll);
        }
        window.requestAnimationFrame(updatescroll);
    }
    window.requestAnimationFrame(updatescroll);
}

$k("#carousel1").make_carousel();
$k("#carousel2").make_carousel();

function reset(){
    $k('.maincontent').find('*').removeAttr('class');
    document.getElementById('step1').setAttribute("class", "visible");
}
function back(){
    var previous_class = $k('.visible').data('previous');
    if(previous_class != ''){
        var current_class = $k('.visible').attr('id');
        document.getElementById(current_class).setAttribute("class","");
        document.getElementById(previous_class).setAttribute("class","visible");
    }
}
function show_next(current,next) {
    document.getElementById(current).setAttribute("class", "hidden");
    document.getElementById(next).setAttribute("class", "visible");
}

function show_hide(show_ele,hide_ele) {
    document.getElementById(show_ele).style.display = "block";
    document.getElementById(hide_ele).style.display = "none";
}
function load_after_sec(id) {
    count = 0;
    wordsArray = ["5", "4", "3", "2", "1"];
    var timerID = setInterval(function () {
        count++;
        if(count == 5){
            $k("#"+id).show();
            $k("#seconds_counter").hide();
            clearInterval(timerID);
        } else {
            $k("#num_sec").fadeOut(400, function () {
                $k(this).text(wordsArray[count % wordsArray.length]).fadeIn(400);
            });
        }                               
    }, 2000);
}
function showButton(){
    document.getElementById("btn_repeat").style.display='block';
}
});
})(jQuery);

这个部分是全宽的，但是在包含 js 之后，它是一个内部 class，它有一些定义的宽度。

Answer 1

您似乎没有使用 wp_enqueue_scripts。在 functions.php 中添加此代码并尝试。

    function custom_scripts() {
        wp_register_script('java1', get_template_directory_uri() . '/js/cr-scroll.js', array( 'jquery' ));
        wp_enqueue_script( 'java1' );
    }
    add_action( 'wp_enqueue_scripts', 'custom_scripts' );

由于自定义 js 文件，编辑器的工具栏丢失

Editor's toolbar is missing due to custom js file

javascript

wordpress

text-editor

editor

wp-editor