我如何有一个form :: select运行脚本来更改目标，以便每次选择不同的选项时样式都会更改？

Question

问题是我正在使用Laravel Form :: select（）并选择子优先级。每个子优先级都有背景颜色。因此，我为检查ID和目标的每个样式都设置了一种样式，因此我的想法是拥有一个脚本，当在下拉列表中选择了当前选项时，该脚本会更改表单的目标。但是我似乎无法让javascript在发生更改时运行，或者如果发生更改，就无法更改目标。

我尝试使用jquery，ajax，javascript并创建与优先级框运行的脚本类似的脚本，但似乎没有任何效果。

<style>

    #sub[target="65"]{

        background-color: #006600;

        color: white;

    }

    #sub[target="66"]{

        background-color: #99ff66;

        color: white;

    }

    #sub[target="67"]{

        background-color: #bbff99;

        color: white;

    }

    #sub[target="68"]{

        background-color: #ffff99;

        color: white;

    }

    #sub[target="69"]{

        background-color: #ffff80;

        color: black;

    }

    #sub[target="70"]{

        background-color: #ffff00;

        color: white;

    }

    #sub[target="71"]{

        background-color: #ff944d;

        color: white;

    }

    #sub[target="72"]{

        background-color: #ff751a;

        color: white;

    }

    #sub[target="73"]{

        background-color: #ff6666;

        color: white;

    }

    #sub[target="74"]{

        background-color: #800000;

        color: white;

    }

</style>

{!! Form::select('subpriority', [65=>'A',66=>'B',67=>'C',68=>'D',69=>'E',70=>'F',71=>'G',72=>'H',73=>'I',74=>'J'], 69, [ 'class' => 'form-control', 'id'=> 'sub', 'target'=>'69' ]); !!}

<script>

    $(#sub).change(function(){

        $(#sub).setAttribute('target', $(#sub).val());

    });

</script>

因此，我希望它仅在选择新选项时更改选择表单的背景颜色。现在，它已将其正确设置为#sub [target =“ 69”]的样式，但是目标没有改变，或者样式没有随目标改变。因此，下拉框以字母E开头为黄色。如果我更改为A，则背景色应更改为绿色。其他选项，依此类推。