函数外的 JavaScript 变量不保留值

Question

下面的代码有问题，我使用 onclick 属性调用下面的函数，然后检查传递了哪种类型的数据属性。然后将其分配给函数外部的局部变量。但是一些它如何保存 1 attr 并在警报中显示它并将另一个显示为未定义，然后当我单击另一个 attr 时它显示它并且第一个显示未定义。下面是我的 js 和 HTML。

jQuery 代码:

<script>
var attr1 = null;
var attr2 = null;


function createLink(sportAttr) {

    if($(sportAttr).attr("data-provider-sport-id") != typeof undefined && $(sportAttr).attr("data-provider-sport-id") !== false) {

        attr2 = $(sportAttr).attr("data-provider-sport-id");

        //alert(attr2);
    }

    if($(sportAttr).attr("data-main-sport-id") != typeof undefined && $(sportAttr).attr("data-main-sport-id") !== false) {
        attr1 = $(sportAttr).attr("data-main-sport-id");
        //alert(attr1);
    }

    alert(attr1 + " and second attr is " + attr2);
    //it never reaches the next line because for some reason one of the attrs is always null
    if(attr1 != null && attr2 != null) {

        if(confirm("Are you sure you want to create this link")) {

        }

    }

}
</script>

HTML代码:

<i data-provider-sport-id="9" onclick="createLink(this)">Music</i>

<b data-main-sport-id="17" onclick="createLink(this)">Music</b>

当我点击第一个时，它显示“undefined and second attr is 9”。

当我点击第二个时，它显示“17 and second attr is undefined”

有什么线索吗？

Answer 1

此检查不正确:

$(sportAttr).attr("data-main-sport-id") != typeof undefined

看，typeof undefined 始终是 string 'undefined'(因为 typeof 始终返回字符串)。除非数据属性恰好相同 - 即字符串 'undefined'，否则此语句为真。

因此，您的问题不在于保留，而是由于配置错误的 if 语句而覆盖了值这一事实。

要解决此问题，请使用此未定义检查(您可能首先尝试过):

typeof $(sportAttr).attr("data-main-sport-id") !== 'undefined'

或者只是使用与 undefined 的简单比较，没有 typeof (但这不太健壮，所以你使用 typeof 的直觉本身并不坏。):

$(sportAttr).attr("data-main-sport-id") !== undefined