我想根据输入字段中输入的数字显示 div。如果用户输入 1，则不应显示任何来宾字段。如果用户输入 2.guest-0应该显示。如果用户输入 3.guest-0并且guest-1应该显示等等。如果用户更改了他们的答案，则应反映他们的更改。
<p>Attendees</p>
<input type="text" class="attendees" max="4">
<div class="guest-0">
<span>guest 1 name</span>
<span>guest 1 more</span>
</div>
<div class="guest-1">
<span>guest 2 name</span>
<span>guest 2 more</span>
</div>
<div class="guest-2">
<span>guest 3 name</span>
<span>guest 3 more</span>
</div>
<div class="guest-3">
<span>guest 4 name</span>
<span>guest 4 more</span>
</div>
<script>
$('div[class*="guest-"]').hide();
</script>
这可以在 jQuery 或纯 JS 中完成
$('.attendees').on('change', function(){
$value = Math.max(0, Number(this.value) - 1);
$('div[class*="guest-"]').hide().slice(0, $value).show();
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句