Question

我正在尝试按下搜索按钮使javascript功能工作但功能似乎没有运行。请指导。 Fiddle

<form action="" method="get" id="searchform" >
    <input name="q" type="text" id="search" size="32" maxlength="128" class="txt"/>
    <input type="submit" id="hit" value="Search" onclick="myFunction()" class="btn"/>
</form>

继承人JS，

function myFunction() {
 alert("I am an alert box!");
}

Answer 1

您已将函数包装在正文onLoad中，只需将其更改为无包装<head>。见this小提琴。

function myFunction() {
    alert("I am an alert box!");
}

};
^^

您的代码中还有一个额外的};

<强>更新

这是因为：

如果函数放在$(document).ready内，那么它只能在就绪回调（以及内部对象）中使用。你不能在外面引用它。

但是如果你把它放在就绪功能之外，那么它就会获得全局范围，即你可以从任何地方调用它。

Answer 2

以下适用于我：

        <form action="" method="get" id="searchform" >
          <input name="q" type="text" id="search" size="32" maxlength="128" class="txt"  >
          <input type="submit" id="hit" value="Search" onclick="myFunction()" class="btn">
        </form>
        <script>
           function myFunction() {
              alert("I am an alert box!");
           }
        </script>

但是我注意到你的问题结尾有一个}; - 也许这会导致语法错误？

<强>更新

问题是（除了};）你的小提琴手的设置。检查 this ！

Answer 3

在我的JavaScript文件中，您似乎最有可能出现语法错误。我之所以这么说，是因为没有任何东西可以阻止警报使用您显示的代码出现。

检查浏览器的错误控制台（IE和Chrome中的F12）并查看是否有任何错误，因为这些将阻止定义该功能。

Answer 4

我看着你的小提琴，它有一个额外的封闭支架。这应该有用。

 function myFunction() {
    alert("I am an alert box!");
    return false;
 };

你的小提琴看起来像这样：

 function myFunction() {
    alert("I am an alert box!");
    } 
};

编辑1： 我添加了return false，因为用户不想提交表单。

编辑2：

由于没有人想解释JS Fiddle问题，我会采取刺激措施。

在原始的JS Fiddle中，“onLoad”用于侧栏菜单上的第二个下拉菜单。

此设置不起作用的原因是JS Fiddle在onload函数中执行javascript代码。这意味着myFunction超出了范围。

这就是您需要在下拉菜单中使用“No wrap-in”和“No wrap-in”选项的原因。通过使用这两个选项，您的函数myFunction将位于全局范围内。

我希望澄清事情。

编辑3

如果您确实想使用onload事件。您可以添加单击事件处理程序，并删除提交按钮标记中的onclick属性。

通常，最好使用javascript设置事件处理程序。

document.getElementById('hit').addEventListener('click', function() {
    alert("I am an alert box!");
});

如果你想使用jQuery，你可以这样做：

$('#hit').click(function() {
    alert("I am an alert box!");
});

Answer 5

将您的功能放在try-catch区块中......应该正常工作

function myFunction() {
    try {    
        alert("I am an alert box!");
        //enter code here
        return false;
    }
    catch (err) {
        txt = "There was an error on this page.\n\n";
        txt += "Error description: " + err.message + "\n\n";
        txt += "Click OK to continue.\n\n";
        alert(txt);
    }
}

onclick无法使用按钮

5 个答案: