0

您可以在这里理解我的意思http://jsfiddle.net/ganymedes/eWghm/1/选择 1986然后选择 Hello最后选择 test2。我的意思是当您选择 test2 时,我的脚本将显示“0”文本,但不会显示。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script></script>
    <script type="text/javascript">
    var zero="0,00";
    var one="0,01";
    $(document).ready(function() {    
        $('#main').on('change', '.select-box', function() {    
            if ($(".select-box option[value='1']").prop('selected') && $(".select-box option[value='1986']").prop('selected')) {    
                $('#street').html("<option value='2'>test</option><option value='3'>test2</option>");    
            }
            if ($(".select-box option[value='1']").prop('selected') && $(".select-box option[value='1986']").prop('selected') && $(".select-box option[value='3']").prop('selected')) {
                 document.getElementById("demo3").innerHTML=""+zero;
            }    
        });    
      });
</script>    
<script type="text/javascript">    
    var x="",i;
    for(i=1986;i<2013;i++)
    {
        x=x + "<option value='"+i+"'> " + i + "</option>";
    }
    $(document).ready(function() {
        document.getElementById("forloop").innerHTML="<select class='select-box'><option>Empty</option>"+x+"</select>";
    });
</script>  
</head>
<body>  
    <p id="forloop"></p>
        <div id="main">
          <select class="select-box">
             <option>Empty</option>
             <option value="1">Hello</option>    
         </select> 
         <p></p>
         <select class="select-box" id="street">
            <option>Empty<option>
         </select>
      </div>    
    <p id="demo3">    
  </body>
</html>
4

2 回答 2

2

每次您更改任何选择时,都会调用相同的处理程序。第一个条件匹配重置第二个选择的内容。所有这些都应该被重写以更有针对性……但是如果你真的想走这条路,你应该交换 if 语句的顺序,并使第二个语句成为 elseif。

于 2012-09-11T14:28:21.530 回答
1

您的三个选择框具有相同的类,因此当第一个选择框的值为 1 时,您的第二个测试始终为真。使用 id 而不是 classname 来区分您的元素,它将更易于理解(#year、#month、#day)并且更易于维护......

于 2012-09-11T14:28:19.470 回答