Question

我正在尝试制作jsfiddle，我的onclick不能在jsfiddle中工作。我的代码有什么问题

<input value="press" type="button" onclick="myclick()">


function myclick(){
   alert("myclick")
}

http://jsfiddle.net/hiteshbhilai2010/gs6rehnx/11/

修改

我尝试No wrap - In head并再次尝试使用document.ready它再次在jsfiddle中工作

ERROR - Uncaught ReferenceError: myclick is not defined

http://jsfiddle.net/hiteshbhilai2010/33wLs160/6/

我已经检查过现有的问题here，但是当我在jsfiddle中尝试时我的问题正在发生

有人可以帮助我....谢谢

Answer 1

您需要选择 No library（纯JS）和 No wrap-in head 。然后它将作为带有javascript页面的简单HTML工作。

这将插入<script>中的<head>元素：

function myclick(){
  alert("myclick")
}

请参阅demo

Answer 2

正如其他人所说，对于第一种情况，您必须将No wrap - in <head>或No wrap - in <body>设置为javascript面板设置（js面板右上方的蓝色链接）。

对于第二个（您的编辑）问题，函数内部的代码和js将运行它（在新的上下文中），但它只会定义一个函数并忽略它而不进行任何调用或赋值。

如果你调用alert（myclick），你会看到所有代码都被执行并且在那时被定义。 see this fiddle

$(document).ready(function() {

  //alert("ready is executed");

  function myclick(){
    alert("myclick is called")
    window.location.reload(true);
  }

  alert(myclick); //this will show the myclick is a defined function!

  //document.getElementsByTagName("input")[0].onclick = myclick;
})

如果你这样称呼：

document.getElementsByTagName("input")[0].onclick = myclick;

在$(document).ready({...})范围内，它将被分配给按钮并按您的意愿工作。

Answer 3

<input value="press" id='a' type="button">
document.getElementById('a').onclick = function() { alert(1); }

http://jsfiddle.net/gs6rehnx/12/

Answer 4

这个工作正常。只需从文档就绪事件中删除它。此外，分号在javascript中是可选的，但我建议使用它们。

＆＃13;

function myclick() {
    alert("myclick");
    window.location.reload(true);
}

＆＃13;

<input value="press" type="button" onclick="myclick();">
<script>
    alert("home");
</script>

＆＃13;

这是fiddle。

Answer 5

在脚本面板的“加载类型”中选择“无环绕-底部”。这是Jsfiddle的解决方案（至2019年12月17日）。

javascript onclick在jsfiddle中不起作用

修改

5 个答案: