Question

我想问一下，在提交表单后，是否有人知道如何更改用作提交按钮的输入的颜色。我使用twitter bootstrap 3，任何方法都会受到欢迎。最简单的越好。在我的代码中，我有一个填写的表单：

<input class="btn btn-default" onclick="document.getElementById('priceform').submit()" name="filter" type="submit" value="Action" style="width:45%;font-size: 12px">

<input class="btn btn-default" onclick="document.getElementById('priceform').submit()" name="filter" type="submit" value="Adventure" style="width:45%;font-size: 12px">

<input class="btn btn-default" onclick="document.getElementById('priceform').submit()" name="filter" type="submit" value="Family" style="width:45%;font-size: 12px">

以及针对每种游戏类型的更多相同类型，它们用作我的产品页面上结果的过滤器。一切都很好，我试图在用户应用的按钮上添加一些颜色来过滤他们的结果，但当然在表单提交后，颜色仍然是默认值。我试过JavaScript，我尝试过JQuery但仍然没有。提前谢谢。

Answer 1

尝试在输入中添加id标记。然后你可以改变所选输入背景的颜色。
这就是......

function change(id){
    document.getElementById(id).style.background = '#999';
}

添加

<input id="action" class="btn btn-default" onclick="document.getElementById('priceform').submit()" onmousedown="change(this.id)" name="filter" type="button" value="Action" style="width:45%;font-size: 12px">
<input id="adventure" class="btn btn-default" onclick="document.getElementById('priceform').submit()"onmousedown="change(this.id)" name="filter" type="button" value="Adventure" style="width:45%;font-size: 12px">
<input id="family" class="btn btn-default" onclick="document.getElementById('priceform').submit()"onmousedown="change(this.id)" name="filter" type="button" value="Family" style="width:45%;font-size: 12px">

为输入添加ID，然后添加一个更改CSS的功能。使用onmousedown="change(this.id);

访问该功能

Answer 2

我使用php超级全局$ _SESSION []来解决这个问题。我将每次按下的输入值存储到会话中，然后通过回显它来应用样式。

if (isset($_SESSION['filter'])) {
    $_GET['filter'] = $_SESSION['filter'];
    $f = $_GET['filter'];                 
    $filter = "AND type = '$f'";         //ignore this part
    $bool = true;                        //and this
    echo '<style>input[value="'.$f.'"] {
        background-color: #428BCA;
        color: white;
        font-weight: bold;
    }</style>';
}

表单提交后输入按钮改变颜色

2 个答案: