javascript - 将参数值传递给按钮

Question

我想单击“日”按钮并打开参数为 1 的报告，然后单击“周”按钮并查看参数为 2 的报告。这是我的代码

   @using Portal.Framework.Models;

<form id="reportParametersForm" method="GET" action="@string.Format("{0}/{1}", @Url.Content("~/Reports/View"), ViewBag.Report)">
    <fieldset style="padding: 0.2em 0 1.2em 0;height:60px">
        <legend style="margin: 0 1px 0 10px;padding: 3px 36px 3px 20px;background-color: #494949;color: white;font-size: 11pt;">
        @Html.Resource(String.Format("Report_{0}", ViewBag.Report as string))</legend>

    <table border="0" cellspacing="0" cellpadding = "0" style="font-size:x-small">        
        <tr valign="bottom" style="height:10px">
           <td width="30px" style="vertical-align: top">
            </td>
            <td width="30px" style="vertical-align: middle" align="center" nowrap="nowrap">
                <label style="font-size:small">
                    Time period</label>

                <input type="hidden" id="dailyReportUrl" value = "@Url?ReportParameter=1" />       
                <input class="button" id="showDailyReport" name="searchQueue" type="submit" value="Day" onClick="onClickHandler(this)" />

                <input type="hidden" id="weeklyReportUrl" value = "@Url?ReportParameter=2" />       
                <input class="button" id="showWeeklyReport" name="searchQueue" type="submit" value="Week" onClick="onClickHandler(this)" />

            </td>
        </tr>

    </table>
</fieldset>
</form>
<script type="text/javascript">

    $(document).ready(function () {

        $("#showDailyReport").click(function () {
            $("#weeklyReportPlaceholder").attr("src", "");
            $("#weeklyReportPlaceholder").attr("src", $("#dailyReportUrl").val());
        });

        $("#showWeeklyReport").click(function () {
            $("#weeklyReportPlaceholder").attr("src", "");
            $("#weeklyReportPlaceholder").attr("src", $("#weeklyReportUrl").val());
        });

    });

    function showDailyReport() {
        alert('daily');
    }

    function showWeekyReport() {
        alert('weekly');
    }

</script>

<script type="text/javascript">
    function onClickHandler(elem) {
        elem.style.background = 'red';
        elem.style.color = 'white';
    }

</script>

目前我只获得 Day 按钮，当我点击 Week 时，我会从我的报告中获得相同的图表图像。加上当我点击某个按钮改变颜色时如何制作以及当我点击其他按钮时返回其他按钮的原始颜色并改变点击按钮的颜色。到目前为止我有这个，但没有用，我得到了 2 个改变的按钮，改变了颜色支架，尽管我点击了其他按钮

<script type="text/javascript">
    function onClickHandler(elem) {
        elem.style.background = 'red';
        elem.style.color = 'white';
    }
</script>

当我点击那个按钮时如何从报告中获取参数值并传递给按钮，以及如何更改唯一事件按钮的颜色

Answer 1

试试这个:

$('input.button').click(function(){
  $(this).css({'background-color' : 'red', 'color' :'white'})

});