11

我正在尝试使 javascript 函数在按下搜索按钮时工作,但该函数似乎没有运行。请指导。小提琴

<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!");
}
4

6 回答 6

11

您已将函数包装在正文中onLoad,只需将其更改为 no wrap-in <head>。看到这个小提琴。

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

};
^^

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

更新:

发生这种情况是因为:

  • 如果函数放在里面$(document).ready,那么它只能在准备好的回调中使用(以及在内部对象中)。你不能在外面引用它。

  • 但是如果你把它放在 ready 函数之外,那么它会得到全局作用域,即你可以从任何地方调用它。

于 2013-03-02T05:28:58.880 回答
6

以下对我有用:

        <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>

但我注意到您};的问题末尾有一个 - 也许这就是导致语法错误的原因?

更新:

问题是(除了};)与您的提琴手的设置有关。看看这个

于 2013-03-02T05:22:21.843 回答
3

在我看来,您的 JavaScript 文件中某处很可能存在语法错误。我之所以这么说是因为没有什么可以阻止使用您显示的代码出现警报。

检查浏览器的错误控制台(IE 和 Chrome 中的 F12)并查看是否有任何错误,因为这些将停止定义函数。

于 2013-03-02T05:17:53.400 回答
3

我看了看你的小提琴,它有一个额外的封闭括号。这应该有效。

 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 超出范围。

这就是为什么您需要在下拉菜单中使用“不换行”和“不换行”选项的原因。通过使用这两个选项,您的函数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!");
});
于 2013-03-02T05:20:26.990 回答
0

将您的功能放在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);
    }
}
于 2013-11-26T21:25:33.060 回答
0
<input type="button" id="hit" value="Search" onclick="myFunction()" class="btn"/>
于 2022-03-02T08:49:05.653 回答