javascript - 无法在点击事件上触发脚本

Question

如果有人能看出这里的罪魁祸首是什么，我将不胜感激。我尝试过使用原生 JS 而不是 jQuery 来实现单击功能，但是，单击功能无论如何都不起作用。我这里一定缺少一些东西。

HTML:

    <ul class="adcats">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    </ul>
    <div class="contactform fashion">Testing</div>
    <div class="contactform othername">Other</div>
    <div class="contactform othername2">Others</div>

JS代码:

    var hideforms = jQuery('.contactform').hide();
    var buttons = jQuery('.adcats > li');
    var hideforms;
    revForm = function () {
    hideforms;
};
    buttons[0].click = function () {
        revForm;
    document.getElementsByClassName("fashion").style.display = "block";
};

Answer 1

使用原生javascript，需要使用onclick添加点击处理程序

buttons[0].onclick = function () {
}

使用 jQuery，您可以使用 .click()

buttons.first().click(function(){
})

另外 document.getElementsByClassName("fashion").style.display = "block"; 是错误的，因为 document.getElementsByClassName("fashion") 返回一个数组，不是单个 dom 元素。因此，如果只有一个 fashion 类元素，那么您需要使用 document.getElementsByClassName("fashion")[0].style.display = "block"; else您需要遍历数组并设置样式

    var arr = document.getElementsByClassName("fashion")
    for (var i = 0; i < arr.length; i++) {
        arr[i].style.display = "block";
    }

可行的解决方案类似于

jQuery(function () {
    var buttons = jQuery('.adcats > li');
    var forms = jQuery('.contactform').hide();

    buttons.click(function () {
        forms.hide();
        forms.filter($(this).data('target')).show()
    })
})

演示:Fiddle