表單提交後輸入按鈕顏色改變

我想問問有沒有人知道在提交表單後，如何更改用作提交按鈕的輸入的顏色。我使用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，但仍然沒有。提前致謝。

來源

2016-06-13 Vasilis Da Vitzi

按鈕顏色改變不會爲你做？ –

表單提交後，它保持原樣。 –

我認爲這是因爲你的頁面在你的表單被提交時重新加載，因此JavaScript的變化被恢復。你必須使用session來保存按鈕狀態或使用ajax來提交表格 –

功能的功能我用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>'; 
}

來源

2016-06-13 05:02:34

嘗試在輸入中添加一個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.Access與onmousedown="change(this.id);

來源

2016-06-13 02:39:10

表單提交後，它不會保持我想要的顏色。我認爲問題在於提交，因爲它再次運行代碼。 –

@VasilisDaVitzi我回答了這個問題後，在我看來，也許你並沒有使用'AJAX.'在這種情況下，是的，它會恢復到原來的HTML和CSS。不確定你的程序的複雜性，但會建議查看'AJAX'或'Jquery'。使用戶輸入錯誤捕捉，頁面操作等更容易擴展每個頁面。很高興你能想出你的問題:) –

謝謝詹姆斯當你回答我的問題時，你是對的。這只是我對網絡開發的新東西，我試圖弄清楚一些事情。下次我肯定會更好。 –

表單提交後輸入按鈕顏色改變

回答

相關問題