Question

我正在尝试将onclick按钮上的事件传递给我的js文件中的函数。我正在使用Brackets中的实时预览进行测试。

在HTML文件上，我有一个如下所示的按钮；

<button class="btn btn-link" type="button" onclick="return submit_ul_form(event);">
    Upload
</button>

在我的JS文件中，我有以下内容；

function submit_ul_form(e)
{
    alert(JSON.stringify(e)); // Gives: {"isTrusted"true}
    var target = e.target;
    alert (JSON.stringify(target)); // Gives: undefined
    ....
}

我不确定为什么会发生这种情况-据我了解，我应该能够从event.target中检索该节点

我也尝试过onclick =“ submit_ul_form（this）”

这将为第一个警报提供{}，为第二个警报提供未定义。

什么可能导致这种行为？

Answer 1

您确实检索了目标节点。 JSON.stringify不会序列化所有属性。使用console.log（e）和console.log（target）进行检查。

Answer 2

正如我在评论中所说（自从我发表评论以来做了一些尝试，所以现在我确定）

JSON.stringlify有一些规则，此处应用的规则是：All the other Object instances (including Map, Set, WeakMap, and WeakSet) will have only their enumerable properties serialized.

look at the doc了解更多详情

最后是一个小脚本，列出了event和target的所有可枚举属性

function submit_ul_form(e)
{
    console.log("enumerable in event : ")
    let a = 0
    for(let i in e) {
      if(e.propertyIsEnumerable(i)) {
        console.log(`${i} = ${e[i]}`)
        a++;
      }
    }
    console.log("Total: " + a)
    console.log("JSON.stringify(e) = " + JSON.stringify(e))
    
    console.log(" ")
    
    var target = e.target;
    
    console.log("enumerable in target : ")
    a = 0
    for(let i in target) {
      if(target.propertyIsEnumerable(i)) {
        console.log(`${i} = ${target[i]}`)
        a++;
      }
    }
    console.log("Total: " + a)
    console.log("JSON.stringify(target) = " + JSON.stringify(target))
}

<button onclick="return submit_ul_form(event);">
    Upload
</button>

从按钮传递事件：event.target未定义； json strigify提供了{“ isTrusted”：true}？

2 个答案: