從Wordpress頁面調用JavaScript函數？

我已經添加了以下功能到我的wordpress主題的JavaScript文件wp-content/themes/xxx/js/script.js從Wordpress頁面調用JavaScript函數？

function calculateBmi() { 
    var weight = document.bmiForm.weight.value 
    var height = document.bmiForm.height.value 
    if (weight > 0 && height > 0) { 
    var finalBmi = weight/(height/100*height/100) 
    document.bmiForm.bmi.value = finalBmi 
    if (finalBmi < 18.5) { 
     document.bmiForm.meaning.value = "That you are too thin." 
    } 
    if (finalBmi > 18.5 && finalBmi < 25) { 
     document.bmiForm.meaning.value = "That you are healthy." 
    } 
    if (finalBmi > 25) { 
     document.bmiForm.meaning.value = "That you have overweight." 
    } 
    } 
    else{ 
    alert("Please Fill in everything correctly") 
    } 
}

我加入以下代碼WordPress的網頁（管理員）上，當你按下按鈕調用該函數形式

<form name="bmiForm"> 
    Your Weight(kg): <input type="text" name="weight" size="10"><br /> 
    Your Height(cm): <input type="text" name="height" size="10"><br /> 
    <input type="button" value="Calculate BMI" onClick="calculateBmi()"><br /> 
    Your BMI: <input type="text" name="bmi" size="10"><br /> 
    This Means: <input type="text" name="meaning" size="25"><br /> 
    <input type="reset" value="Reset" /> 
</form>

當我點擊按鈕和鉻控制檯給出以下消息時沒有任何反應。

Uncaught ReferenceError: calculateBmi is not defined ?page_id=1368:126 onclick

這是什麼錯誤？

來源

2014-05-20 Xtreme

聽起來像你的JS文件沒有正確包含。看看http://codex.wordpress.org/Using_Javascript，看看如何以正確的方式做到這一點。 – Joren

這是創建.js文件的主題創建者，並且該人的功能有效，並且包含如下所示： wp_enqueue_script（'custom_script'，$ jscriptURL.'script.js'，array（'jquery'），'1.0'，真正）; – Xtreme

在附註中，請注意，JavaScript沒有塊範圍。 – toniedzwiedz

這只是一個適當排隊的問題。首先，用HTML提供的測試頁面。請注意，使用全球$b5f_hook可以在此後查看我們的頁面。

add_action('admin_menu', 'add_auxiliary_menu'); 

function add_auxiliary_menu() 
{ 
    global $b5f_hook; 
    $b5f_hook = add_menu_page(
     'Test', 
     '<span style="color:#e57300;">Test</span>', 
     'edit_pages', 
     'b5f_page_id', 
     'b5f_page_callback', 
     '', // icon default for empty 
     1 // create before Dashboard menu item 
    ); 
} 
function b5f_page_callback() 
{ 
    ?> 
    <form name="bmiForm"> 
     Your Weight(kg): <input type="text" name="weight" size="10"><br /> 
     Your Height(cm): <input type="text" name="height" size="10"><br /> 
     <input type="button" value="Calculate BMI" onClick="calculateBmi()"><br /> 
     Your BMI: <input type="text" name="bmi" size="10"><br /> 
     This Means: <input type="text" name="meaning" size="25"><br /> 
     <input type="reset" value="Reset" /> 
    </form> 
    <?php 
}

入隊列的劇本，不知道爲什麼jQuery是被列爲依賴，但它並不重要：

add_action('admin_enqueue_scripts', 'b5f_enqueue'); 
function b5f_enqueue($hook) 
{ 
    global $b5f_hook; 
    if($hook !== $b5f_hook) # Not our page, bail out 
     return; 

    $jscriptURL = get_stylesheet_directory_uri() . '/js/script.js'; 
    wp_enqueue_script('custom_script', $jscriptURL, array('jquery'), '1.0', true); 
}

和腳本文件中包含所提供的JS代碼：

function calculateBmi() { /* rest of the code */ }

來源

2014-05-20 21:45:48 brasofilo

您的函數未定義，因爲它包含語法錯誤。加「;」在每行之後並檢查其他錯誤，例如使用jslint tool

來源

2014-05-20 21:51:09 abimelex

從Wordpress頁面調用JavaScript函數？

回答

相關問題