wwwroot/lis/js/MusicList.js

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

/*
 * 模块：音乐列表
 * 作者：cls
 * 日期：2021.04.18
 * 使用：基于jQuery 和 lis.js， 需绑定一个 zplayer
 */
//var options = { ele: '#id', url: '/api/Music/GetList', keyword: '九万字', kwplaceholder: '输入关键词搜索', zplayer: zplayer, btn: ['play', 'download', 'more'] };
function MusicList(options, callback) {
    var othis = this;
    if (!options || !options.ele || !options.url || !options.zplayer) {
        console.error("MusicList模块加载错误：options缺少必要参数！");
        return;
    }
    var oContainer = $(options.ele);
    if (!oContainer) {
        console.error("MusicList模块加载错误：缺少容器！");
        return;
    }
    var defaultOptions = {
        kwplaceholder: "输入关键词搜索",
        btn: ['play', 'download', 'more'],
    }
    for (var option in defaultOptions) {
        defaultOptions.hasOwnProperty(option) && !options.hasOwnProperty(option) && (options[option] = defaultOptions[option]);
    }

    var shtml = ""
        + "<div class='lst-search'>"
        + "    <div class='lst-search-body'>"
        + "        <input class='lst-search-text' type='text' placeholder='" + options.kwplaceholder + "' />"
        + "        <button class='lst-search-submit' type='submit'><i class='icon-search'></i></button>"
        + "    </div>"
        + "</div>"
        + "<div class='lst-list'>"
        + "</div>";
    oContainer.html(shtml);

    //------------------- 绑定事件 begin --------------
    //搜索
    $(document).on("click", options.ele + " .lst-search-submit", function () {
        Search($(".lst-search-text").val());
    });
    $(document).on("keyup", options.ele + " .lst-search-text", function (event) {
        (event.keyCode == 13) && Search($(this).val());
    });
    //点击播放音乐
    $(document).on("click", options.ele + " .lst-list-item-content", function () {
        if ($(this).hasClass("disabled")) {
            lis.LayerTip.render({ type: 'fail', ins: 'show', tip: "无法播放！" });
            return;
        }
        othis.Play($(this).data("index"));
    });
    //------------------- 绑定事件 end --------------

    var sourceArray = ["", "QQ", "酷狗", "酷我", "网易云"];
    othis.zplayer = options.zplayer;
    othis.musicList = [];
    othis.options = options;
    Search(options.keyword); //搜索