jquery - Javascript：参考错误

Question

我正在尝试在输入表单中调用带有 onchange() 的函数

当我在 Chrome 中检查控制台时，返回以下代码：

ReferenceError: changingNow is not defined

在野生动物园中，它说

  ReferenceError: Can't find variable changingNow

这是代码：

function changingNow() {
 first_name=document.getElementById(first_name);
 last_name=document.getElementById(last_name);
 username=document.getElementById(username);
 category=document.getElementById(category);
 if ((first_name!=="")&&(last_name!=="")&&(username!=="")&&(category!="empty")) {
   form1.process.disabled = false;
 }
 else {
  form1.process.disabled = true;
 }

 document.getElementById('tweet').value = 'I just voted for '+first_name+' '+last_name+'('+username+')'+'in the '+category+' category!';
 }


 First Name<input type="text" name="first_name" id="first_name" class="first_name" maxlength="50" onchange="changingNow"/><br/>

谷歌搜索这似乎表明 jQuery 负责，但页面上没有 jQuery。

谢谢

编辑

Rob W 是正确的，我已经尝试过括号，它们在排序这个问题时无关紧要。不管怎么说，还是要谢谢你！

score 4 · Accepted Answer

你的代码有很多问题。对于初学者，获取各种文本字段值的行是不正确的：

first_name=document.getElementById(first_name);

getElementById需要一个字符串。您没有传递字符串，而是传递了一个尚未定义的变量，名为first_name. 要使它成为一个字符串，请给出一些引号！其次，您没有使用var关键字，这会影响变量的范围。最后，纠正了这两个错误，你仍然没有得到值，你得到了元素——getElementById给你一个HTMLElementObject. 进一步，您尝试将此对象视为字符串：

first_name!==""

就目前而言， first_name永远不会等于空字符串，因为它不是字符串，而是对象。把它们放在一起，你想要：

var first_name=document.getElementById('first_name').value;

这将为您提供 ID 为“first_name”的文本字段的值作为字符串。

此外，您的 if 语句有太多括号！

if ((first_name!=="")&&(last_name!=="")&&(username!=="")&&(category!="empty"))

这些括号不是必需的，而是：

if (first_name !== "" && last_name !== "" && username !== "" && category!= "empty"){ }

// or my personal preference:

if (
     first_name !== "" &&
     last_name !== "" &&
     username !== "" &&
     category!= "empty"
){ }

最后，我建议删除内联onchange事件并将其替换为 javascript 分配：

document.getElementById('first_name').onchange = changingNow;

这只是应用事件的一种方式，有关更多信息，请参阅此答案。

把它们放在一起：

var changingNow = function() {
    var first_name = document.getElementById('first_name').value;
    var last_name = document.getElementById('last_name').value;
    var username = document.getElementById('username').value;
    var category = document.getElementById('category').value;
    var form1 = document.getElementById('form1');
     if (
         first_name !== "" &&
         last_name !== "" &&
         username !== "" &&
         category!= "please choose a category"
    ){
        // this line of code is not valid in regular JS...
        //form1.process.disabled = false;
        document.getElementById('tweet').value = 'I just voted for '+first_name+' '+last_name+' ('+username+')'+' in the '+category+' category!';
    } else {
        // this line of code is not valid in regular JS...
         //form1.process.disabled = true;
        document.getElementById('tweet').value = 'please complete the fields above!';
    }
}
document.getElementById('first_name').onchange = changingNow;
document.getElementById('last_name').onchange = changingNow;
document.getElementById('username').onchange = changingNow;
document.getElementById('category').onchange = changingNow;
changingNow();

在这里试试：http: //jsfiddle.net/yzbWr/

文档

document.getElementById在 MDN - https://developer.mozilla.org/en/DOM/document.getElementById
addEventListener在 MDN - https://developer.mozilla.org/en/DOM/element
MDN 上的可变范围备忘单 - https://developer.mozilla.org/en/JavaScript/Reference/Scope_Cheatsheet

score 0 · Accepted Answer

您可以通过为您的应用程序提供一个全局命名空间然后显式调用该方法来解决此问题：

window.myApp = {};
window.myApp.changingNow = function(){
    // your function code here
};

然后在您的 HTML 中：

<input type="text" ... onchange="window.myApp.changingNow">

score 0 · Accepted Answer

可能是function changingNow()您在插入<input>字段之后定义了它，并且因为您没有执行它 onchange 而是将其分配给 onchange ( changingNow()vs changingNow)，所以您最终将其分配给undefined

score 0 · Accepted Answer

先生们（和女士们？？）我们的问题似乎已经解决了。可悲的是，我的问题是 <script type="text/javascript">省略了“文本”。

尽管如此，还是有解决办法的。似乎 () 是必要的，但我感谢 Chris 的出色回答，而且他对 getelementbyid 的评论确实是正确的。

你的等等，

jquery - Javascript：参考错误

4 回答 4

Related

Reference