javascript - 点击时<a> html标签

我在搜索项目时绑定的局部类中有此对象

<a id="InfoButton" href="~/SupplierMaterials/ModalProductInfo/@item.IdSupplierMaterials"
class="btn btn-xs btn-outline btn-primary">Info <i class="fa fa-long-arrow-right"></i> </a>

在父类中，我有这个脚本

            $("#InfoButton").on("click", function (e) {

                var notModal = String(this.href);
                notModal = notModal.toLowerCase();

                if (notModal.indexOf("modal") != -1) {
                    e.preventDefault();
                    $('#myModalContent').load(this.href, function () {
                        $('#myModal').modal({
                            /*backdrop: 'static',*/
                            keyboard: true
                        }, 'show');

                        bindForm(this);
                    });
                }
            });
        });
        function bindForm(dialog) {

            $('form', dialog).submit(function () {
                $.ajax({
                    url: this.action,

                    type: this.method,
                    data: $(this).serialize(),
                    success: function (result) {
                        if (result.success) {
                            $('#myModal').modal('hide');
                            //Refresh
                            location.reload();
                        } else {
                            $('#myModalContent').html(result);
                            bindForm();
                        }
                    }
                });
                return false;
            });
        }

但是当我单击链接时，功能永远不会触发

最佳答案

我不知道<a id="InfoButton"是否动态加载，但是如果它是动态加载，则需要使用$("*").on("click","#InfoButton", function (e)而不是$("#InfoButton").on("click", function (e)