JsFiddle Javascript没有解雇？

Question

I've got a huge feeling I'm simply being idiotic here, but is it me or is Js not firing in JsFiddle? 我有一种巨大的感觉，我只是在这里愚蠢，但是我还是Js没有在JsFiddle开火？

I built this snippet here but can't seem to get it to fire. 我在这里建立了这个片段，但似乎无法解决它。 Im probably missing something super obvious, but would be grateful for any assistance. 我可能错过了一些非常明显的东西，但对任何帮助都会感激不尽。

HTML HTML

  <div id="col">

    <h3 class="txt spacer">Dynamic input, based on select value...</h3>
    <input type="text" name="field-one" class="txt stretch" />

    <div class="boxes">
      <input type="checkbox" id="box-2" onChange="myFunction()" checked>
      <label for="box-2">Apply a name?</label>
    </div>
  </div>
</div>

Javascript 使用Javascript

function myFunction() {
  // Text field element.
  var a = document.getElementByName('field-one');
  // Checkbox element.
  var b = document.getElementById('box-2');

  if (b.checked) {
    a.disabled = false;
    a.placeholder = 'Not Applicable';
    alert('Checkbox State Changed.');
  } else {
    a.disabled = true;
    a.placeholder = 'Enter Your Full Name';
    alert('Checkbox State Changed.');
  }
}

JS FIDDLE JS FIDDLE

Thanks in advance for the assistance. 在此先感谢您的帮助。

Regards, 问候，

-B. -B。

EDIT 编辑

I'm an idiot. 我是个白痴。 Thanks guys. 多谢你们。

Answer 1

Couple of things here, it should be document.getElementsByTagName (plural) and you need to change the settings, that will embed the JS code in before the body closes. 这里有几件事情，它应该是document.getElementsByTagName （复数），你需要更改设置，这将在正文关闭之前嵌入JS代码。

var a = document.getElementsByName('field-one')[0];

I am using [0] here to access the very first element of the array as document.getElementsByName() will return you an array of elements if encountered multiple matching elements. 我在这里使用[0]来访问数组的第一个元素，因为如果遇到多个匹配元素， document.getElementsByName()将返回一个元素数组。 If you want to select a specific one, make sure you select the DOM element in a more specific way. 如果要选择特定的一个，请确保以更具体的方式选择DOM元素。

And change the Load Type to 并将加载类型更改为

No wrap - in <body> ( <head> will work as well) 没有换行 - <body> （ <head>也能正常工作）

Demo 演示

Answer 2

The Javascript Load Type for your jsFiddle is set to onLoad . jsFiddle的Javascript加载类型设置为onLoad 。 This will nest your myFunction function, and therefore won't be available in the global scope. 这将嵌套myFunction函数，因此无法在全局范围内使用。

You can either change the Load Type, or set the variable on the window : 您可以更改“加载类型”，也可以在window设置变量：

window.myFunction = function()....

NB: You then receive another error for getElementByName . 注意：然后您收到getElementByName另一个错误。 This isn't a function of document . 这不是document的功能。 You're probably looking for getElementsByName . 你可能正在寻找getElementsByName 。

Answer 3

Open the DevTools and you'll see 打开DevTools，你会看到

Uncaught ReferenceError: myFunction is not defined
    at HTMLInputElement.onchange ((index):192)

Now why isn't the function defined? 现在为什么不定义函数？ Perhaps it's not defined at the right spot? 也许它没有在正确的位置定义？

Look at where you load your JavaScript and change it to: 查看加载JavaScript的位置并将其更改为：

Here's an updated fiddle . 这是一个更新的小提琴。 Note that I fixed a typo on line 3 getElementsByName . 请注意，我修复了第3行getElementsByName的拼写错误。

Answer 4

First, set your seeting of javascript LOAD TYPE to head . 首先，设置你的seeting的JavaScript的LOAD TYPE来head 。

last, is getElementsByName not getElementByName and it would return array so you need to parse. 最后， getElementsByName不是getElementByName ，它将返回数组，因此您需要解析。

let a = document.getElementsByName('field-one')[0];

hope it's helpful. 希望它有所帮助。

JsFiddle Javascript没有解雇？

问题描述

4 个解决方案

解决方案1
3 已采纳 2017-07-03 14:23:38

解决方案2
3 2017-07-03 14:24:47

解决方案3
2 2017-07-03 14:24:18

解决方案4
1 2017-07-03 14:28:35

JsFiddle Javascript没有解雇？

问题描述

4 个解决方案

解决方案1 3 已采纳 2017-07-03 14:23:38

解决方案2 3 2017-07-03 14:24:47

解决方案3 2 2017-07-03 14:24:18

解决方案4 1 2017-07-03 14:28:35

解决方案1
3 已采纳 2017-07-03 14:23:38

解决方案2
3 2017-07-03 14:24:47

解决方案3
2 2017-07-03 14:24:18

解决方案4
1 2017-07-03 14:28:35