单击时更改按钮颜色-引导程序

时间:2020-05-14 15:12:21

标签: javascript bootstrap-4

如果该过程成功,我想将“ btn-success”类更改为“ btn-warning”。 或者我们可以将颜色代码更新为“#ffc107”。 我该怎么办?

按钮;

<button type="submit" name="teklifver" value="Teklif Ver" class="btn btn-block btn-success" id="teklifpasif">Teklif Ver</button>

Php代码;

...

    $insert=$query->execute(array(

        "arac_id" =>$arac_id,
        "kullanici_adsoyad"=>$kullcek['kullanici_adsoyad'],
        "ihale_secenek" =>$ihale_secenek

        ));


        if($insert)
        {

          header("Location:index.php");
          ?>

          <script>

            // -------- Must be "btn-warning" ------------

          </script>

          <?php 
        }
        else 
        {
            echo "olmadı";
        }

}  ?>

2 个答案:

答案 0 :(得分:0)

为此的一个简单解决方案是尝试removeClassaddClass

https://api.jquery.com/removeClass/#removeClass-className

$('#teklifpasif').removeClass('btn-success').addClass('btn-warning');

或者您也可以尝试toggleClass

https://api.jquery.com/toggleClass/#toggleClass-className

$('#teklifpasif').toggleClass('btn-success btn-warning');

更新

$(document).ready(function () {
   $('#teklifpasif').removeClass('btn-success').addClass('btn-warning');
 });

错误

您的问题是在header("Location:index.php");之前添加了script,因此您的脚本要到删除header("Location:index.php");才会执行

删除header("Location:index.php");

答案 1 :(得分:0)

这些是JavaScript和JQuery中的一些选项。


在jQuery中

更改颜色

$("#teklifpasif").css("background-color", "#ffc107");

更改班级

$('#teklifpasif').removeClass('btn-success').addClass('btn-warning');

切换类

$('#teklifpasif').toggleClass('btn-success btn-warning');


使用普通JavaScript

更改颜色

document.getElementById("teklifpasif").style.color = "#ffc107";

更改班级

document.getElementById("teklifpasif").classList.remove('btn-success');
document.getElementById("teklifpasif").classList.add('btn-warning');

它们都起作用,我前一阵子尝试过。

只需选择其中一个选项^^