首页 > 解决方案 > 服务器端的 Onclick 事件 html 按钮

问题描述

我有这个项目给我项目的设计是关于 javaScript 函数的 java 脚本是在名为 Admin.Master 的母版页上调用的。设计的 javascript 功能由两个 webform rewardPoints.aspx 和 Transactions.aspx 共享

现在我的问题是如何在 Transaction.aspx 内的 btnExportExcel 中添加点击事件

我的java脚本函数:

function TransSearchControls(page, cs) {
    var html = "";
    var display = (cs == "all") ? "inline-block" : "none";

    html += "<div class='col-xs-12 body'>";
    html += "<div class='col-xs-1 text-left' style='margin-top:5px'>Filter/s:</div>";
    html += "<div class='col-xs-6 col-sm-2'><input type='text' class='input-sm form-control trans-controls-txt-search' placeholder='Search Employee' /></div>";
    html += "<div class='col-xs-6 col-sm-2' style='display:" + display + "'><select class='input-sm slctSoaFilter form-control' >";
    html += "<option value='all' selected disabled>Select Transactions</option>";
    html += "<option value='all'>All</option>";
    html += "<option value='redeem'>Redeemed</option>";
    html += "<option value='earn'>Earned</option>";
    html += "</select></div>";
    html += "<div class='col-xs-1 text-right' style='margin-top:5px'>Date/s:</div>";
    html += "<div class='col-xs-5 col-sm-2'><input type='date' class='input-sm form-control dateFrom' /></div>";
    html += "<div class='col-xs-5 col-sm-2'><input type='date' class='input-sm form-control dateTo' /></div>";

    html += "<div class='col-xs-6 col-sm-2'><button class='btn btn-sm btn-primary btnSearchTrans form-control' type='button' page='" + page + "'><span class='glyphicon glyphicon-search'></span>&nbsp;&nbsp;Search</button></div>";
    html += "</div>";
    if (page == "Transactions") {
        html += "<div class='col-xs-12' style='margin-top:10px'>";
        html += "<button type='button' class='btn btn-sm btn-danger' id='btnExportExcel'><span class='glyphicon glyphicon glyphicon-import'></span>&nbsp;&nbsp;Export Excel</button>";
        html += "<span class='filename-container'></span>";
        html += "</div>";
    }
    if (page == "RewardPoints") {
        html += "<div class='col-xs-12' style='margin-top:10px'>";
        html += "<button type='button' class='btn btn-sm btn-primary' id='btnAddPoints'><span class='glyphicon glyphicon-plus-sign'></span>&nbsp;&nbsp;Add Points</button>&emsp;";
        html += "<button type='button' class='btn btn-sm btn-danger' id='btnImportExcel'><span class='glyphicon glyphicon glyphicon-import'></span>&nbsp;&nbsp;Import Excel</button>";
        html += "<span class='filename-container'></span>";
        html += "</div>";
    }

我想在里面的按钮上添加onclick事件

if (page == "Transactions") 

这就是我的 Transaction.aspx 中的函数调用方式

<script>
        $(document).ready(function () {
            $(".menu-title").html('<span class="glyphicon glyphicon-transfer"></span>&nbsp;&nbsp;Transactions');
            $(".inner-menu-title").html('<span class="glyphicon glyphicon-sort-by-attributes-alt"></span>&nbsp;&nbsp;List of Employee Transactions');
            $(".transactions .main").addClass("active");

            TransSearchControls("Transactions", "all");
            var url = "&EmpName=&DateFrom=" + DefaultDate("from") + "&DateTo=" + DefaultDate("to");
            GetTransactions("Transactions", "all", url);


            $('.dateFrom').val(DefaultDate("from"));
            $('.dateTo').val(DefaultDate("to"));
        });
    </script>

我希望你明白我的意思我不擅长英语

标签: javascriptc#htmlasp.net

解决方案


您需要向onclickhtml 按钮元素添加一个事件。所以它看起来像这样:

html += "<button type='button' onclick='TransactionsEvent()' class='btn btn-sm btn-danger' id='btnExportExcel'><span class='glyphicon glyphicon glyphicon-import'></span>&nbsp;&nbsp;Export Excel</button>";

然后你必须更新 Javascript 中的函数以匹配:

function TransactionsEvent() {
    //do something here
} 

推荐阅读