Javascript 与语音api相同形式的2个按钮

我需要在同一页面中使用两个按钮，用语音api控制两个不同的文本区域 当我单击按钮启用您在文本区域中键入的麦克风时，当我单击另一个按钮启用另一个文本区域中键入的麦克风时，所有这些都在同一个表单中，通过调用语音API，我正在观看使用getElementsByTagName或getElementsByClassName，但到目前为止，我还没有证明没有什么好消息

showInfo（'info_start'）；
var final_转录本=“”；
var=false；
var忽略单宁；
var启动时间戳；
如果（！（窗口中的“webkitSpeechRecognition”）{
升级（）；
}否则{
start_button.style.display='inline block'；
var recognition=new-webkitSpeechRecognition（）；
识别。连续=正确；
recognition.interimResults=false；
recognition.lang=“es-BO”；
recognition.onstart=函数（）{
识别=正确；
showInfo（'info_speak_now'）；
start_img.src='mic animate.gif'；
};
recognition.onerror=功能（事件）{
如果（event.error=='no speech'）{
start_img.src='mic.gif'；
showInfo（“信息不讲话”）；
忽略_onend=true；
}
如果（event.error==“音频捕获”）{
start_img.src='mic.gif'；
showInfo（“信息无话筒”）；
忽略_onend=true；
}
如果（event.error=='不允许'）{
if（event.timeStamp-start_timeStamp<100）{
showInfo（“信息被阻止”）；
}否则{
showInfo（“信息被拒绝”）；
}
忽略_onend=true；
}
};
recognition.onend=函数（）{
识别=错误；
如果（忽略_oned）{
返回；
}
start_img.src='mic.gif'；
如果（！最终成绩单）{
showInfo（“信息开始”）；
返回；
}
showInfo（“”）；
if（window.getSelection）{
getSelection（）.removeAllRanges（）；
var range=document.createRange（）；
range.selectNode（document.getElementById（'final_span'）；
window.getSelection（）.addRange（范围）；
}
};
recognition.onresult=函数（事件）{
var临时_转录本=“”；
对于（var i=event.resultIndex；i”）；
}
var first_char=/\S/；
功能启动按钮2（事件）{
如果（识别）{
识别。停止（）；
返回；
}
最终成绩单=“”；
recognition.lang=“es-BO”；
识别。开始（）；
忽略_onend=false；
final_span.innerHTML=''；
临时的span.innerHTML=''；
start_img.src='mic slash.gif'；
showInfo（“信息允许”）；
显示按钮（“无”）；
开始时间戳=event.timestamp；
}
功能显示信息（s）{
若有(s){
for（var child=info.firstChild；child；child=child.nextSibling）{
if（child.style）{
child.style.display=child.id==s？'inline'：'none'；
}
}
info.style.visibility='visible'；
}否则{
info.style.visibility='隐藏'；
}
}
var当前_样式；
功能显示按钮（样式）{
如果（样式==当前样式）{
返回；
}
当前样式=样式；
}

---------------------------------------------------

您需要将第二个按钮的onclick更改为startButton2（事件），以调用第二个函数

<div >
 <p>
  <button id="start_button" onclick="startButton(event)">
  <img id="start_img" src="mic.gif" alt="Start"></button>
  <textarea id="final_span" class="final"></textarea>
  <span id="interim_span" class="interim"></span>
 </p>
</div>
 <a>---------------------------------------------------</a>
<div >
 <p>
  <button id="start_button" onclick="startButton2(event)">
  <img id="start_img" src="mic.gif" alt="Start"></button>
  <textarea id="final_span" class="final"></textarea>
  <span id="interim_span" class="interim"></span>
 </p>
</div>

---------------------------------------------------