按钮点击事件未触发

Question

.net Core应用程序上的工作。我在“客户”屏幕上有一个针对每个客户的按钮。在单击按钮时，我需要一个“模态”对话框。点击事件不会被触发，不确定原因。

//页面html

<div id="businesses">
    <h3>List of all Businesses</h3>
    <div id="businessesTable">
        <table class="table table-condensed" id="businessIndexTable">
            <thead>
                <tr>
                    <th>Name </th>
                    <th>Logo </th>
                    <th>Phone</th>
                    <th>Email </th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var client in Model.Clients)
                {
                    <tr>
                        <td>@client.Name</td>
                        <td class=""> <img src="@client.LogoUrl" class="img-rounded" height="100" width="100" /> </td>
                        <td>@client.Phone</td>
                        <td>@client.Email</td>
                        <td><button id="btnCalcVS" class="btn btn-success" type="button"> Calculate Validator Score</button></td>
                    </tr>
                }
            </tbody>
        </table>
    </div>

//当用户单击“ btnCalcVS”时应打开的模式对话框

 <div class="modal" id="calculateVSModal" role="dialog" tabindex="-1">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        x
                    </button>
                    <h4 class="modal-title">Calculate Validator Score: Client Name</h4>
                </div>
                <div class="modal-body">
                    <form role="form" id="formCalculateVS">
                        <div class="form-group">
                            <input class="form-control" type="text" placeholder="Question" id="question" />
                        </div>
                        <div class="modal-footer">
                            <button type="button" data-dismiss="modal" class="btn btn-default">Close</button>
                            <button type="button" class="btn btn-success" id="calcVSScore">Calculate</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

// jQuery

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {      

        $(document).on("click", "btnCalcVS", function () {
            alert("We are here");
            $("#calculateVSModal").modal('show');
        });
    });
</script>