微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何获得两个不同的选择框值并根据vanilla JS中的值组合显示结果?

如何解决如何获得两个不同的选择框值并根据vanilla JS中的值组合显示结果?

我需要根据用户选择的日期和月份的组合向用户显示不同的结果(图片)。 示例:如果您选择第 1 天和第 3 个月,您将根据您的选择收到警报,如果您选择第 03 天和第 6 个月,您会得到不同的结果,等等。 这就是我现在设法做的:

这样我可以从两个选定的值中得到两个变量 但是不能通过比较变量 m 和变量 d 得到结果,因为它们在里面 两个不同的功能。但它们需要在两个不同的功能中才能成为 在每个选择框中调用 onChange ,对吗? 什么是解决这个问题的好方法? 谢谢

<select class="sb"  id="day" onChange='getDay(this);'>
                                <option value="">Day</option>
                                <option value="01">01</option>
                                <option value="02">02</option>
                                <option value="03">03</option>
                                <option value="04">04</option>
                                <option value="05">05</option>
                                <option value="06">06</option>
                                <option value="07">07</option>
                                <option value="08">08</option>
                                <option value="09">09</option>
                                <option value="10">10</option>
                                <option value="11">11</option>
                                <option value="12">12</option>
                                <option value="13">13</option>
                                <option value="14">14</option>
                                <option value="15">15</option>
                            </select>
                      
                            <select class="sb"  id="month" onChange='getMonth(this);' >
                                <option value="">Month</option>
                                <option value="1">Jan</option>
                                <option value="2">Feb</option>
                                <option value="3">Mar</option>
                                <option value="4">Apr</option>
                                <option value="5">May</option>
                                <option value="6">Jun</option>
                                <option value="7">Jul</option>
                                <option value="8">Aug</option>
                                <option value="9">Sep</option>
                                <option value="10">Oct</option>
                                <option value="11">Nov</option>
                                <option value="12">Dec</option>
                            </select>


    function getDay(sel) {
                        var d = (sel.options[sel.selectedindex].text);
                        if (d == "01"){
                            console.log("day 1");
                        }
                    }
    
    
         function gethMonth(sel) {
                        var m = (sel.options[sel.selectedindex].text);
                        if (m == "Jan"){
                            console.log("January");
                        }
                    }````

解决方法

function getData(e) {
  var d = document.getElementById("day").value
  var m = document.getElementById("month").value
  
  // Do whatever you want with your two variables d and m
  // for example console.log them
  console.log(d + "." + m);
}
<select class="sb"  id="day" onChange='getData()'>
   <option value="">Day</option>
   <option value="01">01</option>
   <option value="02">02</option>
   <option value="03">03</option>
   <option value="04">04</option>
   <option value="05">05</option>
   <option value="06">06</option>
   <option value="07">07</option>
   <option value="08">08</option>
   <option value="09">09</option>
   <option value="10">10</option>
   <option value="11">11</option>
   <option value="12">12</option>
   <option value="13">13</option>
   <option value="14">14</option>
   <option value="15">15</option>
</select>
                      
<select class="sb"  id="month" onChange='getData()' >
   <option value="">Month</option>
   <option value="1">Jan</option>
   <option value="2">Feb</option>
   <option value="3">Mar</option>
   <option value="4">Apr</option>
   <option value="5">May</option>
   <option value="6">Jun</option>
   <option value="7">Jul</option>
   <option value="8">Aug</option>
   <option value="9">Sep</option>
   <option value="10">Oct</option>
   <option value="11">Nov</option>
   <option value="12">Dec</option>
</select>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。