Question

我正在学习JS，但遇到了障碍。我的链接具有属性＆＃34; number＆＃34;。我想提取＆＃34;数字＆＃34;的价值。从每个链接，将其设置为新变量，然后为包含相应值的每个链接分配onclick操作。我已经能够提取每个值，但不知道如何在onclicks中使用它们。

HTML

<a class="button call" href="#" number="6135555556">Call pager</a>
<a class="button call" href="#" number="6135555555">Call cell</a>

JS

var data = document.getElementsByClassName("call");
var numbers = '';
for (var i = 0; i < data.length; i++) {
    numbers += data[i].getAttribute("number");
    numbers[i].onclick = console.log("call " + numbers[i]);
}

Answer 1

如果您想要点击特定链接的特定值，那么您可以使用此代码。

var data = document.getElementsByClassName("call");
var numbers = [];
for (var i = 0; i < data.length; i++) {
     data[i].onclick = getNumber;
}

function getNumber(){
    numbers.push(this.dataset['number']);
    alert(this.dataset['number']);
}

以下是DEMO

锚标记上没有数字属性，因此根据您的需要，我们可以使用 data - * 属性，该属性允许您在html上存储必要的信息。

Answer 2

这可能不是实体正确，但假设您想要的是在点击链接时控制台记录所包含的电话号码，您可能需要查看3个主要更改。

1）我猜你想把你的onclick事件连接到链接元素，其中包含数字data[i]，而不是数字本身？

2）+=将每个找到的值连接到前一个值。这可能是你想要的，虽然在下面的代码我改变它只是为了记录当前的数字

3）onclick期望传递一个函数，然后在触发click事件时运行该函数。将控制台日志包装在函数中会以预期的格式将其提供给onClick。

假设一切正确，使用上述链接的js应如下所示：

var data = document.getElementsByClassName("call");
for (var i = 0; i < data.length; i++) {
    data[i].onclick = function() { console.log("call " + this.getAttribute("number"));    }
}

希望有所帮助：）

编辑：更新了代码以修复james montagne在下面指出的错误。 getAttribute现在在click事件的上下文中执行，这意味着避免了作用域的问题。很抱歉，完全错过了这个问题。

从每个链接的属性中提取值并使用获取的值分配onclick？

2 个答案: