我在这里寻找答案,但没有找到任何可以直接帮助我的东西,所以我要在这里问。
$(document).ready(function(){
$(".sel").change(function() {
var hh = $('.sel').val();
if(hh == "info")
{
$(this).css("color" , "#333");
}
if(hh == "green")
{
$(this).css("color" , "green");
}
if(hh == "red")
{
$(this).css("color" , "red");
}
if(hh == "orange")
{
$(this).css("color" , "orange");
}
});
});
select.sel
{
border:0;
font-size: 16px;
-webkit-appearance: none;
-moz-appearance: none;
cursor: pointer;
color: #333;
background: transparent;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="sel">
<option selected value="info">Not Taken</option>
<option value="green">Present</option>
<option value="red">Absent</option>
<option value="orange">Late</option>
</select>
<select class="sel">
<option selected value="info">Not Taken</option>
<option value="green">Present</option>
<option value="red">Absent</option>
<option value="orange">Late</option>
</select>
<select class="sel">
<option selected value="info">Not Taken</option>
<option value="green">Present</option>
<option value="red">Absent</option>
<option value="orange">Late</option>
</select>
当有单选输入但当我使用多选输入框时,这是完美运行的.. 这段代码不工作...请帮助..
提前致谢...
最佳答案
要在 onchange 事件中获取 select 的值,请使用 $(this).val()
而不是 $(".sel").val()
。
因此 $(".sel").val()
将始终给出第一个选择元素的值。而 $(this).val()
将给出当前更改选择框的值。
$(document).ready(function(){
$(".sel").change(function() {
var hh = $(this).val();
if(hh == "info")
{
$(this).css("color" , "#333");
}
if(hh == "green")
{
$(this).css("color" , "green");
}
if(hh == "red")
{
$(this).css("color" , "red");
}
if(hh == "orange")
{
$(this).css("color" , "orange");
}
});
});
select.sel
{
border:0;
font-size: 16px;
-webkit-appearance: none;
-moz-appearance: none;
cursor: pointer;
color: #333;
background: transparent;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="sel">
<option selected value="info">Not Taken</option>
<option value="green">Present</option>
<option value="red">Absent</option>
<option value="orange">Late</option>
</select>
<select class="sel">
<option selected value="info">Not Taken</option>
<option value="green">Present</option>
<option value="red">Absent</option>
<option value="orange">Late</option>
</select>
<select class="sel">
<option selected value="info">Not Taken</option>
<option value="green">Present</option>
<option value="red">Absent</option>
<option value="orange">Late</option>
</select>
关于jquery - 如何处理多个选择输入框来处理相同的 jquery?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39512036/