Question

我正在尝试获取两个div .class-date和.class-time的字符串，但我得到一个未捕获的TypeError“e.siblings不是一个函数”。这可能是一个基本的错误，但我无法解决。任何指向正确方向的人都会非常感激。

var Cc = {
    init: function() {
        Cc.bindEvent();
    },
    bindEvent: function() {
        $('.book-class').on("click", function() {
            let selectedclass = this;
            Cc.parseClass(selectedclass);
        });
    },
    parseClass: function(selectedclass) {
        let classdate = selectedclass.siblings('.class-date').text();
        let classtime = selectedclass.siblings('.class-time').text();
        console.log(classdate, classtime);
    }
}

jQuery(document).ready(function($) {
    Cc.init();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="class">
    <div class="class-date">Thursday, 1 January</div>
    <div class="class-time">18:00 — 20:00</div>
    <div class="book-class">Book Class</div>
</div>

Answer 1

在click回调函数中，this是一个HTMLElement，你将其视为jQuery对象。

将let selectedclass = this;更改为let selectedclass = $(this);

Answer 2

您也可以跳过bindEvent点击处理程序中的匿名函数，并将CC.parseClass作为参考传递。它会将this内parseClass的内容更改为事件发生的元素，这可能会或可能不会混淆使用this

var Cc = {
    init: function() {
        Cc.bindEvent();
    },
    bindEvent: function() {
        $('.book-class').on("click", Cc.parseClass);
    },
    parseClass: function(event) {
        // `this` is element from event handler
        let $selectedclass = $(this);
        let classdate = $selectedclass.siblings('.class-date').text();
        let classtime = $selectedclass.siblings('.class-time').text();
        console.log(classdate, classtime);
    }
}

$(function() {
    Cc.init();
});

无法在元素中获取字符串 - 对象文字javascript

2 个答案: