Javascript 确定调用函数的字段

我不知道该问什么，所以请耐心等待

我有一个输入字段，需要获取onfocusin和onfocusout事件并执行一些逻辑

我想用一个普通函数来处理onfocusin，用一个普通函数来处理onfocusout函数

那么-如何确定函数中输入字段的ID

<input type="text" class="form-control" id="location_notes"  onfocusin="fieldFocusIn()" onfocusout="fieldFocusOut()" placeholder="Location Notes">
<input type="text" class="form-control" id="additional_notes"  onfocusin="fieldFocusIn()" onfocusout="fieldFocusOut()" placeholder="Additional Notes">

function fieldFocusIn(){
// do some stuff with the calling field
}

function fieldFocusOut(){
// do some different stuff with the calling field
}

函数fieldFocusIn（）{
//对调用字段做一些处理
}
函数fieldFocusOut（）{
//对调用字段执行一些不同的操作
}

您只需将所需的

id

作为函数参数传递：

<input 
    id="location_notes"  
    onfocusin="fieldFocusIn('location_notes')" 
    onfocusout="fieldFocusOut('location_notes')"
>

function fieldFocusIn(id){
    console.log(id) // location_notes
}

function fieldFocusOut(id){
   console.log(id) // location_notes
}

功能字段聚焦（id）{
console.log（id）//位置\u注释
}
函数fieldFocusOut（id）{
console.log（id）//位置\u注释
}

使用

event.currentTarget.id

-为了获取事件对象，因为您使用的是内联事件，所以需要将

事件

一词传递到函数调用中。a、 e.

onfocusin=“fieldFocusIn（事件）”

在事件处理程序中，您接收事件参数，并查看该事件中的

currentTarget

对象，以及该对象的

id

属性

功能场聚焦（e）{
console.log（e.currentTarget.id）；
//对调用字段做一些处理
}
函数fieldFocusOut（e）{
console.log（e.currentTarget.id）；
//对调用字段执行一些不同的操作
}

在以下情况下，只需从

目标中获取
id
：

function fieldFocusIn(event){
    console.log(event.target.attributes.id.value);
}

function fieldFocusOut(event){
   console.log(event.target.attributes.id.value);
}

<>你也可以考虑如果你发现自己一遍又一遍地连接相同的事件处理程序：


函数聚焦（回调）{
document.querySelector（“#fields”）.addEventListener（'focusin'，
（event）=>回调（event.target.id））；
}
函数focusOut（回调）{
document.querySelector（“#fields”）.addEventListener（'focusout'，
（event）=>回调（event.target.id））；
}
focusIn（（id）=>console.log（`focusIn:${id}`）；
focusOut（（id）=>console.log（`focusOut:${id}`）

onfocusin=“fieldFocusIn（this）”
然后
函数fieldFocusIn（element）
。尝试在函数调用内部传递此函数的可能重复项。就像onFocusIn=“fieldFocusIn（this）”和onFocusOut=“fieldFocusOut（this）”一样，我认为您不需要重复id。您可以简单地执行
onFocusIn=“fieldFocusIn（this.id）”
例如，对，但是内联函数不会自然地传递事件对象。是的-正如您的回答所指出的，他需要稍微修改一下HTML-为什么我会对其进行升级：）