Javascript 具有多个函数的onclick（）只执行第一个

我试图执行两个函数，但它只执行第一个。我认为当我更改HTML变量值时，javascript会停止执行

这是我正在执行的代码： HTML:

---

有人知道它为什么不执行所有功能吗

函数satGeo中有一个输入错误：

 document.getElementById('geodata').value= geoVal;

function country\u function（）{
控制台日志（“内部功能1”）；
};
函数setGeo（geoVal）{
控制台日志（“内部功能2”）；
};
单击
函数satGeo中有一个输入错误：

 document.getElementById('geodata').value= geoVal;


function country\u function（）{
控制台日志（“内部功能1”）；
};
函数setGeo（geoVal）{
控制台日志（“内部功能2”）；
};
单击
我建议只将一个函数附加到
onclick
属性，然后在该事件处理程序中执行所需数量的函数

例如：


或者甚至将侦听器逻辑放在JavaScript中，这样您就可以使HTML远离主应用程序逻辑，并拥有更干净的HTML


我建议只将一个函数附加到
onclick
属性，然后在该事件处理程序中执行所需数量的函数

例如：


或者甚至将侦听器逻辑放在JavaScript中，这样您就可以使HTML远离主应用程序逻辑，并拥有更干净的HTML


在
setGeo
中，您将
.getElementById（）
大写错误

但是，除此之外，您还有大量不需要的代码和脆弱的解决方案，并且不会随着需求的变化而扩展

实际上，您只需要一个具有两个参数的函数——显示/隐藏/切换哪个元素以及对其执行什么操作（显示/隐藏/切换）

此外，通过HTML事件属性设置事件处理程序的实践是一项已有25多年历史的技术，它可以追溯到web标准出现之前，现在不再使用这项古老的技术。将JavaScript与HTML完全分离，并使用现代事件配置标准


//获取您的DOM引用
var f=document.querySelector（“.function”）；
var c=document.querySelector（“.country”）；
var r=document.querySelector（“.region”）；
var l=document.querySelector（“.locale”）；
//用JavaScript而不是HTML设置事件处理程序
f、 addEventListener（“单击”，函数（）{
//只需根据需要多次调用单个函数
//每次使用适当的参数：
显示隐藏切换（c，“显示”）；
显示隐藏切换（r，“隐藏”）；
显示隐藏切换（l，“切换”）；
});
//一个函数完成所有操作
功能显示隐藏切换（元件、操作）{
//对于显示/隐藏/切换操作，只需执行正确的操作
//“隐藏”类的问题。
开关（operation.toLowerCase（））{
案例“展示”：
元素.classList.remove（“隐藏”）；
打破
案例“隐藏”：
元素.classList.add（“隐藏”）；
打破
违约：
元素.classList.toggle（“隐藏”）；
打破
}
}
div{opacity:1；transition:all 1s；}
.function{cursor:pointer；user select:none；margin:1em；}
.hidden{opacity:0；}
点击我
国家
区域
区域设置
在
setGeo
中，您将
.getElementById（）
大写错误

但是，除此之外，您还有大量不需要的代码和脆弱的解决方案，并且不会随着需求的变化而扩展

实际上，您只需要一个具有两个参数的函数——显示/隐藏/切换哪个元素以及对其执行什么操作（显示/隐藏/切换）

此外，通过HTML事件属性设置事件处理程序的实践是一项已有25多年历史的技术，它可以追溯到web标准出现之前，现在不再使用这项古老的技术。将JavaScript与HTML完全分离，并使用现代事件配置标准


//获取您的DOM引用
var f=document.querySelector（“.function”）；
var c=document.querySelector（“.country”）；
var r=document.querySelector（“.region”）；
var l=document.querySelector（“.locale”）；
//用JavaScript而不是HTML设置事件处理程序
f、 addEventListener（“单击”，函数（）{
//只需根据需要多次调用单个函数
//每次使用适当的参数：
显示隐藏切换（c，“显示”）；
显示隐藏切换（r，“隐藏”）；
显示隐藏切换（l，“切换”）；
});
//一个函数完成所有操作
功能显示隐藏切换（元件、操作）{
//对于显示/隐藏/切换操作，只需执行正确的操作
//“隐藏”类的问题。
开关（operation.toLowerCase（））{
案例“展示”：
元素.classList.remove（“隐藏”）；
打破
案例“隐藏”：
元素.classList.add（“隐藏”）；
打破
违约：
元素.classList.toggle（“隐藏”）；
打破
}
}
div{opacity:1；transition:all 1s；}
.function{cursor:pointer；user select:none；margin:1em；}
.hidden{opacity:0；}
点击我
国家
区域
语言环境
所以，要明确的是，在控制台中@RobertaGimenez，您没有看到和错误吗
document.getElementByID不是一个函数
？我没有使用控制台，所以我只知道该值没有改变。我在本地主机的应用程序中工作，没有控制台，什么样的怪物会调试？请帮帮我。所以，要澄清一下，控制台中的@RobertaGimenez，你没有看到和错误吗
document.getElementByID不是一个函数
？我没有使用控制台，所以我只知道该值没有改变。我在本地主机的一个应用程序中工作。没有控制台，什么样的怪物会调试？请帮助我。你能详细说明哪些函数正在执行，哪些没有吗？region_hide（）；类_hide（）；country_show（）和setGeo（）您能详细说明哪些函数正在执行，哪些函数没有执行吗？region_hide（）；类_hide（）；country_show（）和setGeo（）
document.getElementsByClass
 document.getElementById('geodata').value= geoVal;

function onFunctionButtonClick () {
  region_hide();
  class_hide();
  country_show();
  setGeo(1);
}

var functionButton = document.getElementsByClassName('function')[0];
functionButton.addEventListener('click', onFunctionButtonClick);