我无法将 javascript 应用于 Wordpress。你能帮助我吗？

Question

我在 https://www.youtube.com/watch?v=t0swZkgTQnk 学习了本教程 至此解释如何将 javascript 添加到 wordpress。但是当我启动页面时，在源页面中，.js 文件被重新定位到其他地方。

我将 .js 文件放在“C:\Users\xxxxx\Documents\Websites\www.testsite.dev.cc\wp-content\themes\profile-lite\js”中，但在页面源中，文件列在“http://www.testsite.dev.cc/wp-content/themes/profile-lite/style.cssjs/script.js?ver=3.2.1”中。

我尝试在“C:\Users\xxxxx\Documents\Websites\www.testsite.dev.cc\wp-content\themes\profile-lite”中创建一个文件夹，其中包含“style.cssjs”文件夹以查看如果文件可以读取但没有任何运气！

在我的 function.php 文件中，这是我的代码：

function cool_scripts(){

    wp_enqueue_script('cool-stuff', get_stylesheet_uri(). 'js/script.js', array('jquery'), '3.2.1', false);
}
    add_action('wp_enqueue_scripts','cool_scripts');

在我的 script.js 文件中，这是我的代码：

//with class div
		jQuery(document).ready(function(){
			$(".videowidth").hover(function(){
				$(this).children("video")[0].play();
			},
			function(){
			$(this).children("video")[0].pause();
			});
		});
		// Without id and class div
		/*$(document).ready(function(){
			$("video").hover(function(){
				$(this)[0].play();
			},
			function(){
			$(this)[0].pause();
			});
		});*/

我希望文件能够加载，但控制台中出现此错误。

（索引）：103 GET http://www.testsite.dev.cc/wp-content/themes/profile-lite/style.cssjs/script.js?ver=3.2.1 net::ERR_ABORTED 404（未找到） enter image description here

Answer 1

我找到了！！

(function($) {
    $(function() {
        $('video').hover(function() {
            this.play();
        }, function() {
            this.pause()
        });
    });
})(jQuery);

Answer 2

您需要使用get_stylesheet_directory_uri() 而不是get_stylesheet_uri()。

function cool_scripts(){

    wp_enqueue_script('cool-stuff', get_stylesheet_directory_uri(). 'js/script.js', array('jquery'), '3.2.1', false);
}
add_action('wp_enqueue_scripts','cool_scripts');

有关选择get_template_directory_uri 或get_stylesheet_directory_uri 的更多信息，请参阅this answer。