Javascript 使用JS绑定onchange事件（语法错误）

我最近花了一些时间玩javascript事件监听器，试图了解更多。但是我遇到了一个障碍

我似乎得到了一个语法错误，

SyntaxError:expected expression，得到了关键字“if”。

问题

如果有人能向我详细解释我的错误，我将不胜感激。请参阅Js Fiddle，了解我试图实现的更完整的示例

我尝试使用控制台突出显示的MDN（）阅读更多内容。然而，我无法理解我的错误以及它是如何与本文相一致的

function myFunction() {

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

  // Checkbox element.
  var b = document.getElementById('box-2');

  // Select Element
  var c = document.getElementById('dept');

  // Bind onchange event.
  c.setAttribute('onchange', myFunction()),

  if (b.checked) {
    a.disabled = false;
    a.placeholder = 'Enter Your Full Name.';

  } else {
    a.disabled = true;
    a.placeholder = 'Not Applicable.';
  }

}

function myFunction()

在此方面的任何帮助都将不胜感激

问候,

-B

---

编辑7月4日星期二

最后，我彻底修改了它，试图让事情变得更顺利一点。在你们的帮助下，我能澄清一些事情

特别是@Kind User和@Shaminder S Aujla强调的要点

• 您使用了逗号而不是分号
• 如果要调用函数，只需使用函数名即可
• 绑定函数时不要调用它
• 像

  myFunction（）一样调用它将抛出“太多递归错误”
  

由此产生的变化如下所示，你也可以看到我完成的小提琴

再次感谢大家， 非常感谢。：）

问候,，

---

-B.

您的代码中有语法错误。 这：

请更改为：

// Bind onchange event.
  c.setAttribute('onchange', myFunction);

另外，在调用函数时，省略关键字函数： 所以，这样称呼它：

myFunction();

• 您使用了逗号而不是分号
• 如果要调用函数，只需使用函数名即可
• 绑定函数时不要调用它

  function myFunction() {
  
     var a = document.getElementsByName('field-one')[0];
  
     var b = document.getElementById('box-2');
  
     var c = document.getElementById('dept');
  
     c.setAttribute('onchange', myFunction);
  
     if (b.checked) {
       a.disabled = false;
       a.placeholder = 'Enter Your Full Name.';
     } else {
       a.disabled = true;
       a.placeholder = 'Not Applicable.';
   } 
  
  }
  
  myFunction();
  

函数myFunction（）{
//文本字段元素。
var a=document.getElementsByName（'field-one'）[0]；
//复选框元素。
var b=document.getElementById（'box-2'）；
//选择元素
var c=document.getElementById（'dept'）；
//绑定onchange事件。
c、 setAttribute（'onchange'，myFunction）；//分号+不要调用它
如果（b.选中）{
a、 禁用=错误；
a、 占位符='输入您的全名'；
}否则{
a、 禁用=真；
a、 占位符='不适用'；
}
}
myFunction（）；//调用函数

@导入url（'https://fonts.googleapis.com/css?family=Open+Sans'）；
* {
保证金：0；
填充：0；
}
h3{
颜色：#fff！重要；
左侧填充：0！重要；
}
#文本字段{
位置：相对位置；
高度：100vh；
}
#上校{
宽度：40%；
保证金：0自动；
位置：绝对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
}
.垫片{
边缘底部：.5em；
}
.原件{
背景图像：线性渐变（到底部，rgba（0,0,0,0.3）0%，rgba（0,0,0,0.3）100%），url(http://imageshack.com/a/img661/3954/bwalqa.jpg);
背景位置：中心；
背景重复：无重复；
-webkit背景尺寸：封面；
-moz背景尺寸：封面；
-o-背景尺寸：封面；
背景尺寸：封面；
}
.txt{
字体系列：“开放式Sans”、Arial、Helvetica、Sans serif！重要；
字体重量：200！重要；
字母间距：4px！重要；
字体大小：26px！重要；
文本转换：大写；
颜色：#2727；
填充：.5em；
}
.伸展{
框大小：边框框；
宽度：100%；
}
.班次{
利润率最高：9%；
}
.盒子{
框大小：边框框；
宽度：100%；
保证金：自动；
填充：1.5em；
背景：线性梯度（至底部，rgba（0,0,0,0.6）0%，rgba（0,0,0,0.6）100%）；
边缘顶部：1.5em；
}
/*复选框样式*/
输入[type=“checkbox”]{
显示：无；
}
输入[type=“checkbox”]+标签{
显示：块；
位置：相对位置；
左侧填充：35px；
边缘底部：20px；
字体：14px/20px“开放式Sans”，Arial，Sans serif；
颜色：#ddd；
光标：指针；
-webkit用户选择：无；
-moz用户选择：无；
-ms用户选择：无；
}
输入[type=“checkbox”]+标签：最后一个子项{
页边距底部：0；
}
输入[type=“checkbox”]+标签：在{
内容：''；
显示：块；
宽度：20px；
高度：20px；
边框：1px实心#6cc0e5；
位置：绝对位置；
左：0；
排名：0；
不透明度：.6；
-webkit过渡：全部.12s，边框颜色.08s；
过渡：全部.12s，边框颜色.08s；
}
输入[type=“checkbox”]：选中+标签：之前{
宽度：10px；
顶部：-5px；
左：5px；
边界半径：0；
不透明度：1；
边框顶色：透明；
左边框颜色：透明；
-webkit变换：旋转（45度）；
变换：旋转（45度）；
}
.选择器{
保证金：3em 3em；
}

选择。。。
冬天
春天
夏天
秋
基于复选框状态的动态输入。。。
申请一个名字？

您缺少分号（；）。删除逗号并用分号替换。 看看这个。 那应该是

// Bind onchange event.
  c.setAttribute('onchange', myFunction());

并删除最后一行，即

函数myFunction（）

编辑

拆下这条线

c.setAttribute('onchange', myFunction());

把最后的功能称为

myFunction();

保留内联绑定，即

onchange=“myFunction（）”

以下是更新的fiddle：

您至少有两个问题

1）必须以分号结尾：

不正确：

  c.setAttribute('onchange', myFunction()),

function myFunction()

更正：

  c.setAttribute('onchange', myFunction());

function myFunction(){
//future codes here

}

2）函数必须有一个主体：

不正确：

  c.setAttribute('onchange', myFunction()),

function myFunction()

更正：

  c.setAttribute('onchange', myFunction());

function myFunction(){
//future codes here

}

我将这些代码移动到函数（myFunction）中，以使其正常工作：

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


  // Checkbox element.
  var b = document.getElementById('box-2');
    if (b.checked) {
    a.disabled = false;
    a.placeholder = 'Enter Your Full Name.';

  } else {
    a.disabled = true;
    a.placeholder = 'Not Applicable.';
  }

---

我已经试过了，但它只是提供了另一个语法错误，

SyntaxError:expected expression，get end of script.

像myFunction（）一样调用它；将抛出“太多递归错误”，绑定函数时不应调用该函数。调用函数myFunction（）而不是绑定它myFunction.Syntax错误意味着您的js无效，比如该语句不是JavaScript语言的正确部分，这意味着您的代码没有