JavaScript 与 WordPress 冲突

Question

我的地理定位功能正常工作，但如果我将其放入 WordPress，它就会停止工作。这是什么问题？

http://jsfiddle.net/spzg5oL8/3/

$.get("http://freegeoip.net/json/", function (response) {
    $("#ip").html("IP: " + response.ip);
    //$("#country_code").html(response.country_code);
    document.getElementsByClassName(response.country_code)[0].style.display = "block";
}, "jsonp");

Answer 1

由于一个原因(肯定)和另一个原因(可能)，这在 WordPress 中不起作用:

首先，您不能在 WordPress 中使用 $ 进行 jQuery。 WordPress 以“无冲突”模式加载 jQuery，这意味着您必须使用 jQuery，或者将其包装在文档就绪方法中以“注入(inject)”$:

 jQuery(function($) {
    $.get("http://freegeoip.net/json/", function (response) {
        $("#ip").html("IP: " + response.ip);
        //$("#country_code").html(response.country_code);
        // Why don't you use jQuery here, for simplicity?
        // $('.' + response.country_code).style('display', 'block');
        document.getElementsByClassName(response.country_code)[0].style.display = "block";
    }, "jsonp");
});

其次，您必须确保您的 WordPress 网站上加载 jQuery。无论您做什么，不要只是在站点标题中硬编码指向 jQuery 的链接，而是在主题(或插件)的 functions.php 文件中硬编码)添加以下 php:

add_action('wp_enqueue_scripts', 'load_my_scripts');

function load_my_scripts() {
    wp_enqueue_script('jquery');
}