未调用onClick（）的Javascript函数_Javascript_Forms_Onclick

未调用onClick（）的Javascript函数

javascript forms

未调用onClick（）的Javascript函数,javascript,forms,onclick,Javascript,Forms,Onclick,我试图清理我们网站上的一些代码（以目前的形式，我们必须为我们提供的所有产品制作50个左右的JS文件和50个左右的PHP文件）。我正在看代码，它应该是有效的，所以我不知道我在哪里搞砸了。函数似乎根本没有被调用（我在函数顶部放了一个从未被调用过的警报），所以我假设我在第一节中搞砸了 <select class="gameserverselecion4" name="slots"> <option value="

我试图清理我们网站上的一些代码（以目前的形式，我们必须为我们提供的所有产品制作50个左右的JS文件和50个左右的PHP文件）。我正在看代码，它应该是有效的，所以我不知道我在哪里搞砸了。函数似乎根本没有被调用（我在函数顶部放了一个从未被调用过的警报），所以我假设我在第一节中搞砸了

                <select class="gameserverselecion4" name="slots">
                    <option value="10|457">10 Slots - 9.90 / mo</option>
                    <option value="12|458">12 Slots - 11.88 / mo</option>
                    <option value="14|459">14 Slots - 13.86 / mo</option>
                <option value="16|460">16 Slots - 15.84 / mo</option>
                    <option value="18|461">18 Slots - 17.82 / mo</option>
                    <option value="20|462">20 Slots - 19.80 / mo</option>
                    <option value="22|463">22 Slots - 21.78 / mo</option>
                    <option value="24|464">24 Slots - 23.76 / mo</option>
                    <option value="26|465">26 Slots - 25.74 / mo</option>
                    <option value="28|466">28 Slots - 27.72 / mo</option>
                    <option value="30|467">30 Slots - 29.70 / mo</option>
                    <option value="32468">32 Slots - 31.68 / mo</option>
            </select>
            </div>
            <div id="inputTopRight">
                <input type="button" name="submit" onclick="ProcessOrder('0','167','44');"/>
            </div>

此行有语法错误：

alert("Slots is: " + slots " cfopValue is:" + cfopValue);
//                         ^-- here

…这可能就是你没有看到警报的原因。如果您修复了它，您可能会发现函数被调用（因为上面的语法错误阻止它被定义）

一旦到达调用函数的位置，您仍然会遇到一个（不相关的）问题：您的

switch

语句的语法错误，尽管这是一种相当无害的方式，前提是您确实希望所有的条件都相互影响。单个的

case

s不包含在大括号中，解析器将完全忽略这些大括号。您使用

中断

终止

案例

，因此：

switch (slots)
{
    case 10:
        window.location = "https://www.xfactorservers.com/clients/cart.php?a=add&pid=" + pid + "&configoption[" + cfopID + "]=" + cfopValue;
        break;

    case 12:
        window.location = "https://www.xfactorservers.com/clients/cart.php?a=add&pid=" + pid + "&configoption[" + cfopID + "]=" + cfopValue;
        break;

    default:
        // do whatever you do if nothing matches (this is optional)
        break;
}

如果没有中断，每个

案例的代码将流入下一个案例。例如，在您原来的示例中，如果插槽是10
，首先将窗口位置设置为10
案例中的位置，然后继续执行12
案例并将其设置为其他位置，等等

主题外：您可以在该函数中排除许多共性；例如：
function ProcessOrder(loc,pid,cfopID)
{
    var values = document.dropTop.slots.value;
    var valuesArray = values.split("|");
    var slots = valuesArray[0];
    var cfopValue = valuesArray[1];
    var destinationMap = {
            "10": "pid=" + pid + "&configoption[" + cfopID + "]=" + cfopValue,
            "12": "pid=" + pid + "&configoption[" + cfopID + "]=" + cfopValue,
            "14": "pid=167&configoption[44]=459",
            "16": "pid=167&configoption[44]=460",
            "18": "pid=167&configoption[44]=461",
            "20": "pid=167&configoption[44]=462",
            "22": "pid=167&configoption[44]=463",
            "24": "pid=167&configoption[44]=464",
            "26": "pid=167&configoption[44]=465",
            "28": "pid=167&configoption[44]=466",
            "30": "pid=167&configoption[44]=467",
            "32": "pid=167&configoption[44]=468"
        };
    var dest = destinationMap[slots];
    if (dest) {
        window.location = "https://www.xfactorservers.com/clients/cart.php?a=add&" + dest;
    }
    else {
        // Do whatever you should do if `slots` isn't a value you recognize
    }
}

（我在每个字符串中都保留了pid=
，因为在我看来它对上下文有帮助。）
您的代码有几个问题
语法问题
1.最好避免在他们自己的线路上加括号，否则会在某个时候让你受伤
更新（2015年7月21日）：正如评论中所指出的，在这种情况下应该可以，因为返回对象文字是不同的，并且是边缘大小写。不过，为了安全起见，我还是宁愿把支架放在同一条线上
因此，与此相反：
function sayHello()
{
    alert('Hello, world!');
}

var a = 'foo';
var b = 'bar';
var c = 'baz';

您应该这样做：
function sayHello() {
    alert('Hello, world!');
}


2.你不应该在箱子周围使用大括号。相反，用break语句结束它们
switch (number) {
    case 3:
    case 12:
        doSomething();
        break;
}

更新（2015年7月21日）：使用大括号是可以的，但它们不会取代break
。如果您不使用它，它将在执行下一个特定案例后“崩溃”到下一个案例
错：
switch (number) {
    case 4: {
        doSomething();
    }
    case 9: {
        doSomething();
    }
}

正确：
switch (number) {
    case 4:
        doSomething();
        break;
    case 9:
        doSomething();
        break;
}

3。开关语句和函数未关闭
4.此行有语法错误
alert("Slots is: " + slots " cfopValue is:" + cfopValue);
//                         ^---here

这是正确的语法：
alert("Slots is: " + slots + " cfopvalue is:" + cfopvalue);


样式问题
1。您可以组合多个var语句
switch (number) {
    case 3:
    case 12:
        doSomething();
        break;
}

与此相反：
function sayHello()
{
    alert('Hello, world!');
}

var a = 'foo';
var b = 'bar';
var c = 'baz';

您可以这样做：
var a = 'foo',
    b = 'bar',
    c = 'baz';

2.您可以在switch语句中组合多种情况
switch (number) {
    case 3:
    case 12:
        doSomething();
        break;
}

3.
alert("Slots is: " + slots + " cfopvalue is:" + cfopvalue);

这将显示如下内容：
function addEvent(element, eventType, eventHandler) {
    if (window.addEventListener) {
        element.addEventListener(eventType, eventHandler, false);
    } else {
        element.attachEvent('on' + eventType, eventHandler);
    }
}

插槽为：10 CFOP值为：20
您可能需要插入换行符（\n
），以便看起来更好：
alert("slots is: " + slots + "\n" + "cfopvalue is: " + cfopvalue);

插槽为：10个

cfopvalue为：20
4.将内容、样式和脚本分开。因此，与其使用内联事件处理程序，不如在JS代码中设置事件处理程序，如下所示：
function addEvent(element, eventType, eventHandler) {
    if (window.addEventListener) {
        element.addEventListener(eventType, eventHandler, false);
    } else {
        element.attachEvent('on' + eventType, eventHandler);
    }
}

用法示例：
addEvent(document.getElementsByName('submit'), 'click', function() {
    ProcessOrder('0', '167', '44');
});

您也可以使用类似的库。这将使事情变得更简单
更新（2015年7月21日）：像jQuery这样的库是一个有用的工具，但您不应该完全依赖它们。熟悉“香草”JavaScript也很重要
jQuery为您处理跨浏览器的不兼容性，并使用CSS选择器选择元素。以下是使用jQuery编写上述事件处理程序代码的方法，以供参考：
$('[name="submit"]').click(function () {
    ProcessOrder('0', '167', '44');
});

如果您使用的是Firefox并安装了firebug，或者任何基于webkit的浏览器，请在单击按钮时发布控制台输出？事实上，如果javascript被正确地包含，它应该可以工作。我假设ProcessOrder
比您显示的要多，因为目前您还没有关闭函数或开关。这可能是程序中其他地方的语法错误。在函数运行之前，请尝试注释JavaScript代码的各个部分，这样您就知道错误在注释的部分。@Michael：实际上调试它需要整个页面，可能最好留给您。但是请注意，我在您评论时添加的编辑，您的switch
语句是不正确的（在某种程度上，我不希望解析器关心；但是，一旦您得到它被调用的点，它将无法正常工作）。@Michael:但至少，您的alert
行是一个语法错误。您缺少一个+
。（任何一个不太像样的浏览器都应该为你标记出来。）这可能就是你没有看到警报的原因。我已经更新了我的答案来标记它。“最好不要在自己的行上放大括号，否则自动插入分号会让你在某个时候出错”这对控制结构来说是不正确的（if
，while
，等等）。如果事实上，除了返回带有对象文本的
（实际上是一个非常边缘的情况），我想不出任何其他例子。还有其他的吗？@T.J.克劳德混合各种风格不是一个好的做法。因此，如果你有一个带有对象文字的返回语句，你就必须移动所有的大括号。这些大括号的用途完全不同（控制块和对象定义），对它们有不同的规则是完全合理的。再说一遍：你还有其他的例子吗？@T.J.克劳德目前，我想不出任何其他的例子；但我不想辩论，所以我恳请你停止辩论。谢谢。我不是在辩论，我是在问。如果你想不出第二个也没关系，不用担心。最好的，