jquery给video元素添加播放监听事件

js

页面加载时给每个video元素添加监听视频的play事件，由于jquery不能直接添加监听事件，所以使用get(key)获取到原生后再添加。

<script>
    $(function() {
        $("video").each(function (key, item) {
            let a = $("video").get(key).addEventListener('play', function (e) {
                let data = e.currentTarget.dataset
                let id = data.id
                let clicknum = data.clicknum
                ++e.currentTarget.dataset.clicknum
                if (clicknum > 0) return false //clicknum防止多次点击
                $.ajax({
                    type: "POST",
                    url: "/EcolgCollege/UpdateViewCount",
                    data: { id: id },
                    dataType: "json",
                    success: function (data) {
                    }
                });
            })
        });
    });
</script>

html

在点击播放按钮时，触发play

<div class="view_list" data-tag="false" data-index="@index">
    <input type="hidden" name="page" value="1" />
    <ul>
        @foreach (var item3 in item1.VideoListSecond.Take(pageSize))
        {
            <li>
                <div class="video">
                    <video  data-id="@item3.Id" data-clicknum="0" src="@item3.VideoUrl" controls="controls" onclick="clickVideo"></video>
                </div>
                <div class="text">
                    <h3>@item3.Name</h3>
                    <p><span>共<small>@item3.ViewCount</small>人学习</span><span>@item3.Author</span></p>
                </div>
            </li>
        }
    </ul>
</div>

video补充知识点：https://www.cnblogs.com/rogerwu/p/10072119.html