onclick事件中的外部javascript函数

onclick事件中的外部javascript函数,javascript,wordpress,events,onclick,external,Javascript,Wordpress,Events,Onclick,External,我使用的是WrodPress 4.0.1。 我有一个简单的表单在网页中的HTML。 在表单之后,我有一个带有onclick事件处理程序的按钮,它在单击按钮时调用一个函数来访问该表单。 我希望onclick事件触发的函数位于名为group membership cost.js的外部javascript文件中。外部JavaScript文件中的函数称为groupMembershipCost()。 我的问题是:我不知道如何让onclick事件处理程序在单击按钮时调用groupMembershipCost

我使用的是WrodPress 4.0.1。 我有一个简单的表单在网页中的HTML。 在表单之后,我有一个带有onclick事件处理程序的按钮,它在单击按钮时调用一个函数来访问该表单。 我希望onclick事件触发的函数位于名为
group membership cost.js
的外部javascript文件中。外部JavaScript文件中的函数称为
groupMembershipCost()
。 我的问题是:我不知道如何让onclick事件处理程序在单击按钮时调用groupMembershipCost(),它位于group-membership-cost.js中。 我尝试过使用
,但当我在Firebug控制台中查看时,我得到了
参考错误:groupMembershipCost未定义

这是HTML表单

<form id="group_membership">
6 - 9 members: <input name="6_9" type="text" /> x $35 per member
10 - 14 members: <input name="10_14" type="text" /> x $30 per member
15 - 19 members: <input name="15_19" type="text" /> x $25 per member</form>
<button onclick="groupMembershipCost()">Calculate total for Group Membership</button>

Total: <span id="total">0</span>
脚本已正确排队,因为当我查看页面的HTML源代码时,我看到

<script type='text/javascript' src='http://mywebsite.com/wp-content/themes/myTheme/javascript/group-membership-cost.js?ver=1.0'></script>

如果该网页位于正确链接到该网页的.js文件中,我不明白为什么该网页无法访问
groupMembershipCost()
。如果使用WordPress的脚本排队功能将
group membership cost.js
文件正确链接到页面,那么该JavaScript文件中的函数是否可用于HTML文档?

我加载了WordPress 4.0.1,无法重现该问题。这段代码在FirefoxV33和ChromeV39中适用

你是怎么安排的?我做了以下工作:

  • 将html放入页面的文本框中
  • 将wp_enqueue_脚本函数放在

    ../wordpress/wp content/themes/yourTheme/functions.php

  • 把剧本放进去

    ../wordpress/wp content/themes/yourTheme/javascript/group-membership-cost.js


  • 你是否在当前的Wordpress应用程序中使用主题你的主题

    在Adrew说他无法重现这个问题后,我确信我大部分时间都正确编码了。这促使我寻找“duh”错误。很抱歉浪费了你男人的时间。如果有人在乎的话,这就是问题所在

    我回去看网页,看网页的来源。在页面的源代码中,我点击了脚本的超链接,它打开了一个包含脚本JavaScript代码的编辑器。由于某些原因,我以前对脚本所做的更改不存在

    以前,我在
    group membership cost.js
    函数的开头和结尾都有
    标记,这些标记是我开始尝试在HTML文档中内联编写所有这些代码时留下的。但当我将JavaScript代码放入.js文件时,我删除了这些标记。出于某种原因,删除
    标记的一个更改并没有保存,它自然地破坏了一切

    因此,我只是使用WinSCP将其ftp到服务器,在WinSCP的文本编辑器中打开脚本文件,然后点击工具栏中的“重新加载”图标。然后我硬刷新了网页。 现在它起作用了

    我想我什么也没学到,只是为了确保认真地点击WinSCP文本编辑器中的“重新加载”按钮。

    对不起,浪费了大家的时间

    JS区分大小写,groupMembershipCost和groupMembershipCost是不同的函数名。请显示JS文件的内容。对不起,这不是大小写问题。代码始终为groupMembershipCost()。我只是在这里打错了。没有理由让它不工作,但请尝试
    wp_enqueue_脚本('group membership',get_template_directory_uri()。/javascript/group membership cost.js')脚本正在加载到头部?@David你的意思是删除最后3个参数:array()、'1.0'和false?谢谢你告诉我你无法重现这个问题。这让我知道代码基本上是正确的。我发现了这个问题,承认这一点让我觉得很愚蠢,但我会把答案贴出来。
    
    <script type='text/javascript' src='http://mywebsite.com/wp-content/themes/myTheme/javascript/group-membership-cost.js?ver=1.0'></script>
    
    function groupMembershipCost() {
    
    var output = document.getElementById("total");
    
    var group1 = document.getElementsByName("6_9")[0].value;
    
    var group2 = document.getElementsByName("10_14")[0].value;
    
    var group3 = document.getElementsByName("15_19")[0].value;
    
    
    if (group1 != '' && parseInt(group1) != NaN) {
        if (parseInt(group1) < 6) {
            output.innerHTML = "The number of group members in this category must be greater than 5."; 
        }
        else if (parseInt(group1) > 9) {
            output.innerHTML = "The number of group members in this category must be less than 10.";
        }
        else {
            output.innerHTML = parseInt(group1) * 35;
        }
    }
    
    else if (group2 != '' && parseInt(group2) != NaN) {
         if (parseInt(group2) < 10) {
            output.innerHTML = "The number of group members in this category must be greater than 9."; 
        }
         else if (parseInt(group2) > 14) {
            output.innerHTML = "The number of group members in this category must be less than 15.";
        }
        else {
            output.innerHTML = parseInt(group2) * 30;
        }
    }
    
    
    else if (group3 != '' && parseInt(group3) != NaN) {
        if (parseInt(group3) < 15) {
            output.innerHTML = "The number of group members in this category must be greater than 14."; 
        }
        else if (parseInt(group3) > 19) {
            output.innerHTML = "The number of group members in this category must be less than 20.";
        }
        else {
            output.innerHTML = parseInt(group3) * 25;
        }
    }
    
    else { output.innerHTML = "Please enter the number of people in your group into one of the three boxes above."; }
    
    }