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()
    })
})

演示：小提琴

Answer 2

你得到什么错误？如果什么都没有，但表格没有隐藏，原因一定是

revForm = function () {
    hideforms;
};

它应该是

revForm = function () {
    hideforms();
};

并且不要忘记对 revForm 函数的调用，它应该是revForm();

Answer 3

尝试这个

$(".adcats > li").on('click',function() {
    document.getElementsByClassName("fashion").style.display = "block";
});