jsfiddle.net上未运行JavaScript
下面的代码可以在一个实时站点上运行，但是我不能让它在站点jsfiddle上运行。
请参见this示例。
有人能告诉我为什么它在jsfiddle上不起作用吗
在控制台上，它记录：ReferenceError: fillList is not defined和ReferenceError: mySelectList is not defined。
当代码以代码片段的形式嵌入到这里时，你可以看到它的工作方式：
function BetterSelect(oSelList) {
this.objSelectList = oSelList;
this.objSelectList.onchange = this.selectionChanged;
}
BetterSelect.prototype.clear = function() {
this.objSelectList.options.length = 0;
}
BetterSelect.prototype.fill = function(aValues) {
this.clear();
for (var i = 0; i < aValues.length; i++) {
this.objSelectList.options[i] = new Option(aValues[i]);
}
}
BetterSelect.prototype.find = function(strToFind, bSelect) {
var indx = -1;
this.objSelectList.options.selectedIndex = -1;
for (var i = 0; i < this.getCount(); i++) {
if (this.objSelectList.options[i].text == strToFind) {
indx = i;
if (bSelect)
this.objSelectList.options.selectedIndex = i;
}
}
return indx;
}
BetterSelect.prototype.getCount = function() {
return this.objSelectList.options.length;
}
BetterSelect.prototype.selectionChanged = function() {
alert("selection changed!");
}
var mySelectList = null;
window.onload = function() {
mySelectList = new BetterSelect(document.getElementById('theList'));
}
function fillList() {
mySelectList.fill(["one", "two", "three", "four", "five"]);
}
function findIt() {
mySelectList.find(document.getElementById('txtToFind').value, true);
}<form action="" method="post">
<select multiple="multiple" name="Select1" id="theList" style="width: 152px; height: 226px">
</select>
<br />
<input name="Button1" type="button" value="Fill The List" onclick="fillList()" />
<input name="Button4" onclick="mySelectList.clear()" type="button" value="Clear The List" />
<br />
<input name="Button2" onclick="alert(mySelectList.getCount())" type="button" value="What's The Count?" />
<br />
<input name="Text1" type="text" id="txtToFind" />
<input name="Button3" type="button" value="Search" onclick="findIt()" />
</form>
回答 3
Stack Overflow用户
发布于 2011-03-29 13:43:22
您定义的函数是在onload函数中定义的，因此在它们之前是可引用的，因为它们是在该函数中定义的，所以它们只能从该函数中引用。您可以在HTML中将它们作为全局变量引用。您有三个选项
a) (最简单，最快，不理想)-将function blah(){}更改为window.blah = function(){};，使函数成为全局函数。
b) (理想方式)-使用不显眼的Javascript将行为单独从JS中附加到DOM元素，这意味着将HTML从JS中分离出来。
c)让jsfiddle不包装负载中的东西。将onLoad更改为无包裹( body或head )。
因此，您将只在JS中执行var e = document.getElementById('foo'); e.onclick = lol;，而不是<p onclick="lol()" id="foo">。
我推荐b，因为它鼓励最佳实践。
Stack Overflow用户
发布于 2016-07-01 17:15:02
我发现了同样的问题，并通过在JavaScript设置中更改Load Type来解决它：
JavaScript设置下拉菜单中的No wrap-in<head>或No wrap-in<body>。请参阅下图。
Stack Overflow用户
发布于 2016-10-24 02:23:30
请看：
https://stackoverflow.com/a/4935684/6796393
或者更好的是看看这个：
https://stackoverflow.com/a/19110630/6796393
以下是我测试的内容：
function testJSON() {
var jsonString = '{"param1":"123","param2":"XXX78","param3":"11378"}';
var tmp_obj = eval('(' + jsonString + ')');
document.getElementById("result").innerHTML = tmp_obj.param2;
}和
function testJSON() {
var jsonString = '{"param1":"123","param2":"XXX78","param3":"11378"}';
var tmp_obj = JSON.parse(jsonString);
document.getElementById("result").innerHTML = tmp_obj.param2;
} 最好使用第二种方法。
来自How to parse parameters from JSON String using JS?的P.S.> I
https://stackoverflow.com/questions/5468350
复制相似问题
腾讯云开发者
