私信  •  关注

Shree Hauto Sagarin

Shree Hauto Sagarin 最近创建的主题
Shree Hauto Sagarin 最近回复了
7 年前
回复了 Shree Hauto Sagarin 创建的主题 » 单击按钮时jquery分别显示

您可以使用下面这样的函数为div添加“d-none”类 removeClass .

$('#showMcq, #showOe, #showLt, #showAs').click(function() {
  $(this).parents('.course-design-custom').addClass('d-none');
});

$('#showMcq').click(function() {
  hidedivfirst();
  $('#McqView').removeClass('d-none');
});

$('#showOe').click(function() {
  hidedivfirst();
  $('#OeView').removeClass('d-none');
});

$('#showAs').click(function() {
  hidedivfirst();
  $('#AssessmentView').removeClass('d-none');
});

$('#showLt').click(function() {
  hidedivfirst();
  $('#LearningTaskView').removeClass('d-none');
});

function hidedivfirst() {
  $('.row').addClass('d-none');

}
.d-none {
  display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="showMcq">MCQ</button>
<button id="showOe">Open Ended</button>
<button id="showLt">Learning Task</button>
<button id="showAs">Assessment</button>
<div class="container">
  <div class="row course-design-custom" id="McqView">
    MCQ
  </div>
  <div class="row course-design-custom d-none" id="OeView">
    Open Ended
  </div>
  <div class="row course-design-custom d-none" id="LearningTaskView">
    Learning Task
  </div>
  <div class="row course-design-custom d-none" id="AssessmentView">
    Assessment
  </div>
</div>