Question

好的，这对屁股很痛苦。我已经尝试了每种方法来实现这一点，但它无法正常工作。我想要点击此按钮时发出警报。

html是

    <div class="btn btn-default" style="width: 44px;" ng-class="{'active btn-success': hasCategory(category)}" ng-click="processAnswer(category, true)">
    <i class="glyphicon glyphicon glyphicon-thumbs-up"></i>
  </div>

单击按钮后，它将变为

    <div class="btn btn-default active btn-success" style="width: 44px;" ng-class="{'active btn-success': hasCategory(category)}" ng-click="processAnswer(category, true)">
    <i class="glyphicon glyphicon glyphicon-thumbs-up"></i>
  </div>

我一直在使用

    $("").click(function() {
alert("button was clicked");
});

和

    document.getElementByClass('btn btn-default active btn-success').onclick = function() {
alert("button was clicked");
};

我最后的目标是在单击此按钮时调用函数，但如果我只是替换我用来测试的警报，那么这很容易做到。

Answer 1

你可能意味着document.getElementsByClassName。这将返回符合您的类名标准的DOM节点数组。

然后您可以通过索引简单地指定所需的元素。

例如，如果它是页面上的唯一按钮，则可以在索引[0]处访问它。

document.getElementsByClassName('btn btn-default active btn-success')[0].onclick = function() {
  alert("button was clicked");
};

如果您正在尝试使用jQuery完成此操作，则可以使用.classname约定来选择这样的类：

$('.btn .btn-default .active .btn-success')[0].onclick(function() {
  alert("button was clicked");
});

最后，使用document.getElementById简单地为其提供唯一ID并以此方式访问它可能更容易：

像这样更改HTML：

<div id="buttonId" class="btn btn-default" style="width: 44px;" ng-class="{'active btn-success': hasCategory(category)}" ng-click="processAnswer(category, true)">
    <i class="glyphicon glyphicon glyphicon-thumbs-up"></i>
  </div>

然后像这样添加监听器：

document.getElementById('buttonId').onclick = function() {
  alert("button was clicked");
};

您还应考虑将点击事件移至<i></i>图标，而不是其容器<div>。

在没有Id的javascript中单击按钮时发出警报

1 个答案: