Question

如果有人能看到这里的罪魁祸首，我将不胜感激。我尝试使用原生JS而不是jQuery来实现click功能，但是，click功能无论如何都无法正常工作。我必须在这里找到一些东西。

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";，否则需要遍历数组并设置样式

    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

Answer 2

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

revForm = function () {
    hideforms;
};

应该是

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

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

Answer 3

试试这个

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

无法在点击事件中触发脚本

3 个答案: