JQuery通过radio,select改变隐藏显示div

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_36092584/article/details/52740681

1)select下拉框控制div的隐藏与显示

JQuery通过radio,select改变隐藏显示divJQuery通过radio,select改变隐藏显示div


  1. <script>
  2. function checkYear() {
  3. var selectValue = $("select[name='periodType']").val();
  4. if(selectValue == 1){
  5. $("#isPeriodYearHalf").hide();
  6. }
  7. if(selectValue == 2){
  8. $("#isPeriodYearHalf").show();
  9. }
  10. }
  11. </script>
  12. <pre name="code" class="java"><span>报表类型:
  13. <select name="periodType" onchange="checkYear();">
  14. <option value="1">年报</option>
  15. <option value="2">半年报</option>
  16. </select>
  17. </span>
  18. <span id="isPeriodYearHalf" style="display:none">报表半年:
  19. <select name="periodYearHalf">
  20. <option value="1">上半年</option>
  21. <option value="2">下半年</option>
  22. </select>
  23. </span>



1)radio单选框控制div的隐藏与显示

JQuery通过radio,select改变隐藏显示divJQuery通过radio,select改变隐藏显示div


  1. <script>
  2. $(function(){
  3. var isPermanentValue = $('input[name="isPermanent"]:checked ').val();
  4. if(isPermanentValue == 1){
  5. $("#validityPeriodTime").hide();
  6. }
  7. if(isPermanentValue == 0){
  8. $("#validityPeriodTime").show();
  9. }
  10. $(".merchantzc_radio").click(function(){
  11. var isPermanentValue = $('input[name="isPermanent"]:checked ').val();
  12. if(isPermanentValue == 1){
  13. $("#validityPeriodTime").hide();
  14. }
  15. if(isPermanentValue == 0){
  16. $("#validityPeriodTime").show();
  17. }
  18. })
  19. })
  20. </script>
  21. <pre name="code" class="java"><li>
  22. <span>永久有效:</span>
  23. <div>
  24. <div>
  25. <input type="radio" name="isPermanent" class="merchantzc_radio" value="1">是
  26. </div>
  27. <div>
  28. <input type="radio" name="isPermanent" checked class="merchantzc_radio" value="0">否
  29. </div>
  30. </div>
  31. </li>


上一篇:js控制TR的显示隐藏


下一篇:dynamic_cast