页面上的WordPress嵌入的JavaScript不起作用(Wordpress embedded

我试图复制下面的jsfiddle： https://jsfiddle.net/7nbr6/10/

在我的WordPress网站。

当我把它复制到网站当我点击按钮，它不会做任何事情。

我使用这个插件把JavaScript的到我的网页： https://wordpress.org/plugins/css-javascript-toolbox/

HTML：

<!-- Throw in a nice looking font just for the fun of it -->
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,700,300,200">
<div id="wrap">
<h2>Kelly calculator</h2>
    <div class="formStyles"> 
        <input id="probability" type="text" value="Probability"><br>
        <input id="odds" type="text" value="Odds"><br>
        <input id="balance" type="text" value="Balance"><br>
        <input id="submit" type="submit" value="Submit">
        <input id="reset" type="reset" value="Reset">
        <div id="result"></div>
    </div>
</div>

使用Javascript：

<script type="text/javascript">
jQuery('#submit').on('click', function() {
    var probability = jQuery('#probability').val();
    var odds = jQuery('#odds').val();
    var balance = jQuery('#balance').val();
    result = parseFloat(((probability/100)* (odds - 1) / (odds - 1) * odds - 1).toFixed(4)) * 0.95;
    var stake = ((balance / 100) * parseFloat((result * 100).toFixed(2)))
    jQuery('#result').text((result * 100).toFixed(2) + '% of' + balance + '€ which is ' +stake + '€');
});
</script>

该代码绝对是嵌入到网页标题（通过查看页面源代码可见），但按钮不起作用。

我最初以为是noConflict（）这里详细的问题：类型错误：$是不是jQuery的调用函数时，函数

我也有在编辑器（插件里面）这个错误，但是，当我浏览的网页不会显示在控制台中：

https://i.imgur.com/3FKt1Mi.png

我试着删除脚本标记，但随后它只是把它放到标题为文本。

谢谢你的帮助

Answer 1:

你试图将处理程序附加到一个元素之前的DOM已准备就绪。一个包裹里面的代码ready处理程序解决此问题：

jQuery(function() {
    jQuery('#submit').on('click', function() {
        var probability = jQuery('#probability').val();
        var odds = jQuery('#odds').val();
        var balance = jQuery('#balance').val();
        result = parseFloat(((probability/100)* (odds - 1) / (odds - 1) * odds - 1).toFixed(4)) * 0.95;
        var stake = ((balance / 100) * parseFloat((result * 100).toFixed(2)))
        jQuery('#result').text((result * 100).toFixed(2) + '% of' + balance + '€ which is ' +stake + '€');
    });
});

在你的JavaScript包裹的代码是简写形式，jQuery的.ready事件。

Answer 2:

当装载你的代码，jQuery是没有准备好。因此，你的代码是相当忽视。

把你的代码中：

jQuery(function() {
/* your code here */
)};