0
Follow
0
View

The front end displays different drop-down boxes based on the selected type

drlowa 注册会员
2023-02-28 13:28

Reference jq

img


  <div>
    <label><input type="radio" name="type" value="1" checked="true">按周label>
    <label><input type="radio" name="type" value="2">按月label>
    <label><input type="radio" name="type" value="3">按季度label>
  div>
  <div>
   
   
    <div bindvisible="type" bindvalue="1" class="bold">按周周周周周div>
    <div bindvisible="type" bindvalue="2" style="display:none;" class="bold">按按按按按按按月div>
    <div bindvisible="type" bindvalue="3" style="display:none;" class="bold">按季季季季季季季度div>
  div>
  <script>
  $(document).ready(function(){
      $(document).on('change', 'input', function () {
        var nm = $(this).attr('name');
        var val = $(this).val();
        if ($('input[bind=' + nm + ']').length > 0) {
            $('input[bind=' + nm + ']').each(function () {
                var v = $(this).attr('bindvalue').split(',')
                if (v.indexOf(val) < 0) {
                    $(this).attr('disabled', 'disabled');
                } else {
                    $(this).removeAttr('disabled');
                }
            })
        }
        if ($('*[bindvisible=' + nm + ']').length > 0) {
            $('*[bindvisible=' + nm + ']').each(function () {
                var v = $(this).attr('bindvalue').split(',')
                if (v.indexOf(val) < 0) {
                    $(this).hide()
                } else {
                    $(this).show();
                }
            })
        }
    })
  });
  script>

dream313 注册会员
2023-02-28 13:28

Change the disable attribute of the corresponding drop-down list to true/false to enable/disable.

About the Author

Question Info

Publish Time
2023-02-28 13:28
Update Time
2023-02-28 13:28

Related Question