如何允许在 datatist 中只标记一个图像？

Question

如何使用 jquery 设置 selected 图像的样式图片库基于数据列表，因此当您 select 画廊中的另一张图片时，上一张 select 编辑图片的样式将被删除。脚本：

<script type="text/javascript">
         $(document).ready(function () {
             $('.Image1').click(function () {
                $(this).css('border', '3px solid orange');
             });
         });
</script>

Answer 1

切换 class 比使用 css() 更容易撤消，因为您可以轻松地将 class 作为选择器来删除它

$('.Image1').click(function() {
  // remove class from prior selection
  $('.Image1.selected').removeClass('selected');
  // add classs to current selection
  $(this).addClass('selected')
});

.Image1 {
  border: 1px solid #ccc;
  margin: 1em;
  padding: 1em;
}

.Image1.selected {
  border: 3px solid orange
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="Image1">One</div>
<div class="Image1">Two</div>
<div class="Image1">Three</div>
<div class="Image1">Four</div>

如何允许在 datatist 中只标记一个图像？

How to allow marking only one image in the datatist?

asp.net

jquery

datalist