Question

HTML： -

<h1 id="title">Javascript example no.2</h1>
<input type="text" id="myTextField"/>
<input type="submit" id="byBtn" value="Change" onclick="F_change()"/>

JAVASCRIPT： -

function change() {

  var myNewTitle = document.getElementById('myTextField').value;
  if (myNewTitle.length == 0) {
    alert('Write Some real Text please.');
    return;
  }

  var title = document.getElementById('title');
  title.innerHTML = myNewTitle;

}

当用户在文本字段中输入文本并单击按钮时，新文本将替换标题文本。

此jsfiddle可行（感谢Emad Elsaid：https://jsfiddle.net/user/blazeeboy/fiddles/）。

此jsfiddle不起作用。

这让我很生气，请帮帮忙。

更新

我应该发现功能名称中的明显不匹配（F_Change与更改）。

对我来说，最重要的教训是设置jsfiddle ... javascript ...加载类型

来自“on load”

到“没有包装”。

感谢所有响应者。

Answer 1

onclick函数具有不同的名称，F_change（）与函数名称

不匹配

Answer 2

改变这个：

function change() {

到此：

function F_change() {

并更改Javascript - ＆gt; Load Type至"No Wrap - in <head>"

Answer 3

将代码更改为：

<html>
<body>
<h1 id="title">Javascript example no.2</h1>
<input type="text" id="myTextField"/>
<input type="submit" id="byBtn" value="Change" onclick="F_change()"/>
<script>
function F_change() {
  var myNewTitle = document.getElementById('myTextField').value;
  if (myNewTitle.length == 0) {
    alert('Write Some real Text please.');
    return false;
  }
    var title = document.getElementById('title');
  title.innerHTML = myNewTitle;
}
</script>

</body>
</html>

Answer 4

在HTML中Onclick是F_change（）但在javascript中他们调用change（）。所以onclick和函数名称是不同的。

因此我们可以使用与函数名称相同的名称

我们可以使用onclick =＆＃34; F_change（）＆＃34; function F_Change（）或onclick =＆＃34; change（）＆＃34;功能改变（）

Answer 5

问题是由Javascript加载到HTML中的方式引起的。在工作JSFiddle中，脚本在脚本放置在文档的head时加载，而在另一个JSFiddle中，脚本放在函数体中，当文档触发{时{1}}事件。这些加载脚本的方法命名为＃34;没有包装＆＃34;和＆＃34; onLoad＆＃34;分别在JSFiddle中。只需比较下面HTML代码的两个片段，取自您在问题中链接到的JSFiddle页面。

有效的JSFiddle：

ready

不起作用的JSFiddle：

<script type='text/javascript'>//<![CDATA[

    function change(){

        ...

    }

//]]> 

</script>

因为<script type='text/javascript'>//<![CDATA[ window.onload=function(){ //... *** LINKED ON STACK EXCHANGE - DO NOT UPDATE, FORK INSTEAD *** function change() { ... } }//]]> </script>函数是在change回调函数的范围内定义的，所以在该函数之外定义的Javascript不可见。因此，您无法通过内联Javascript调用它。无需更改功能名称，只需将window.onload（在齿轮图标下找到）更改为＆＃34;无需更换＆＃34;一切都会好起来的。

jsfiddle相同（？）小提琴按钮改变文本一个工作一个没有

5 个答案: