第二个 Instagram 按钮的 CSS 属性

Question

chbronson

Asked:2023-07-11 14:27:19 +0000 UTC2023-07-11 14:27:19 +0000 UTC 2023-07-11 14:27:19 +0000 UTC

jQuery、js。对具有相同类的元素进行单独的事件处理？

772

$('.buy').click(function() {
  $(this).parents('.bottom').addClass("clicked");
});

$('.remove').click(function() {
  $(this).parents('.bottom').removeClass("clicked");
});

html,
body {
  background: #E3E3D8;
  font-family: sans-serif;
  padding: 25px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

.wrapper {
  width: 300px;
  height: 500px;
  background: white;
  margin: auto;
  position: relative;
  overflow: hidden;
  border-radius: 10px 10px 10px 10px;
  box-shadow: 0;
  transform: scale(0.95);
  transition: box-shadow 0.5s, transform 0.5s;
}

.wrapper:hover {
  transform: scale(1);
  box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}

.wrapper .container {
  width: 100%;
  height: 100%;
}

.wrapper .container .top {
  height: 80%;
  width: 100%;
  background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
  -webkit-background-size: 100%;
  -moz-background-size: 100%;
  -o-background-size: 100%;
  background-size: 100%;
}

.wrapper .container .bottom {
  width: 200%;
  height: 20%;
  transition: transform 0.5s;
}

.wrapper .container .bottom.clicked {
  transform: translateX(-50%);
}

.wrapper .container .bottom h1 {
  margin: 0;
  padding: 0;
}

.wrapper .container .bottom p {
  margin: 0;
  padding: 0;
}

.wrapper .container .bottom .left {
  height: 100%;
  width: 50%;
  background: #f4f4f4;
  position: relative;
  float: left;
}

.wrapper .container .bottom .left .details {
  padding: 20px;
  float: left;
  width: calc(70% - 40px);
}

.wrapper .container .bottom .left .buy {
  float: right;
  width: calc(30% - 2px);
  height: 100%;
  background: #f1f1f1;
  transition: background 0.5s;
  border-left: solid thin rgba(0, 0, 0, 0.1);
}

.wrapper .container .bottom .left .buy i {
  font-size: 30px;
  padding: 30px;
  color: #254053;
  transition: transform 0.5s;
}

.wrapper .container .bottom .left .buy:hover {
  background: #A6CDDE;
}

.wrapper .container .bottom .left .buy:hover i {
  transform: translateY(5px);
  color: #00394B;
}

.wrapper .container .bottom .right {
  width: 50%;
  background: #A6CDDE;
  color: white;
  float: right;
  height: 200%;
  overflow: hidden;
}

.wrapper .container .bottom .right .details {
  padding: 20px;
  float: right;
  width: calc(70% - 40px);
}

.wrapper .container .bottom .right .done {
  width: calc(30% - 2px);
  float: left;
  transition: transform 0.5s;
  border-right: solid thin rgba(255, 255, 255, 0.3);
  height: 50%;
}

.wrapper .container .bottom .right .done i {
  font-size: 30px;
  padding: 30px;
  color: white;
}

.wrapper .container .bottom .right .remove {
  width: calc(30% - 1px);
  clear: both;
  border-right: solid thin rgba(255, 255, 255, 0.3);
  height: 50%;
  background: #BC3B59;
  transition: transform 0.5s, background 0.5s;
}

.wrapper .container .bottom .right .remove:hover {
  background: #9B2847;
}

.wrapper .container .bottom .right .remove:hover i {
  transform: translateY(5px);
}

.wrapper .container .bottom .right .remove i {
  transition: transform 0.5s;
  font-size: 30px;
  padding: 30px;
  color: white;
}

.wrapper .container .bottom .right:hover .remove,
.wrapper .container .bottom .right:hover .done {
  transform: translateY(-100%);
}

.wrapper .inside {
  z-index: 9;
  background: #92879B;
  width: 140px;
  height: 140px;
  position: absolute;
  top: -70px;
  right: -70px;
  border-radius: 0px 0px 200px 200px;
  transition: all 0.5s, border-radius 2s, top 1s;
  overflow: hidden;
}

.wrapper .inside .icon {
  position: absolute;
  right: 85px;
  top: 85px;
  color: white;
  opacity: 1;
}

.wrapper .inside:hover {
  width: 100%;
  right: 0;
  top: 0;
  border-radius: 0;
  height: 80%;
}

.wrapper .inside:hover .icon {
  opacity: 0;
  right: 15px;
  top: 15px;
}

.wrapper .inside:hover .contents {
  opacity: 1;
  transform: scale(1);
  transform: translateY(0);
}

.wrapper .inside .contents {
  padding: 5%;
  opacity: 0;
  transform: scale(0.5);
  transform: translateY(-200%);
  transition: opacity 0.2s, transform 0.8s;
}

.wrapper .inside .contents table {
  text-align: left;
  width: 100%;
}

.wrapper .inside .contents h1,
.wrapper .inside .contents p,
.wrapper .inside .contents table {
  color: white;
}

.wrapper .inside .contents p {
  font-size: 13px;
}

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Обработка события в элементах с одинаковым классом</title>
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link rel="stylesheet" href="./style.css">

</head>

<body>
  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 1</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 1</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 2</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 2</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 3</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 3</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

</body>

</html>

现在，当点击buy,remove 的子元素时，会对所有底部元素进行点击处理。必须仅针对一个（其）父元素 Bottom处理单击。

4 个回答

Voted

Ербол Кабзитов · Answer 1 · 2023-07-11T14:36:42Z

将parents() 与“.block”选择器一起使用来查找父元素

$('.buy').click(function() {
  $(this).parents('.bottom').addClass("clicked");
});

$('.remove').click(function() {
   $(this).parents('.bottom').removeClass("clicked");
});

html,
body {
  background: #E3E3D8;
  font-family: sans-serif;
  padding: 25px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

.wrapper {
  width: 300px;
  height: 500px;
  background: white;
  margin: auto;
  position: relative;
  overflow: hidden;
  border-radius: 10px 10px 10px 10px;
  box-shadow: 0;
  transform: scale(0.95);
  transition: box-shadow 0.5s, transform 0.5s;
}

.wrapper:hover {
  transform: scale(1);
  box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}

.wrapper .container {
  width: 100%;
  height: 100%;
}

.wrapper .container .top {
  height: 80%;
  width: 100%;
  background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
  -webkit-background-size: 100%;
  -moz-background-size: 100%;
  -o-background-size: 100%;
  background-size: 100%;
}

.wrapper .container .bottom {
  width: 200%;
  height: 20%;
  transition: transform 0.5s;
}

.wrapper .container .bottom.clicked {
  transform: translateX(-50%);
}

.wrapper .container .bottom h1 {
  margin: 0;
  padding: 0;
}

.wrapper .container .bottom p {
  margin: 0;
  padding: 0;
}

.wrapper .container .bottom .left {
  height: 100%;
  width: 50%;
  background: #f4f4f4;
  position: relative;
  float: left;
}

.wrapper .container .bottom .left .details {
  padding: 20px;
  float: left;
  width: calc(70% - 40px);
}

.wrapper .container .bottom .left .buy {
  float: right;
  width: calc(30% - 2px);
  height: 100%;
  background: #f1f1f1;
  transition: background 0.5s;
  border-left: solid thin rgba(0, 0, 0, 0.1);
}

.wrapper .container .bottom .left .buy i {
  font-size: 30px;
  padding: 30px;
  color: #254053;
  transition: transform 0.5s;
}

.wrapper .container .bottom .left .buy:hover {
  background: #A6CDDE;
}

.wrapper .container .bottom .left .buy:hover i {
  transform: translateY(5px);
  color: #00394B;
}

.wrapper .container .bottom .right {
  width: 50%;
  background: #A6CDDE;
  color: white;
  float: right;
  height: 200%;
  overflow: hidden;
}

.wrapper .container .bottom .right .details {
  padding: 20px;
  float: right;
  width: calc(70% - 40px);
}

.wrapper .container .bottom .right .done {
  width: calc(30% - 2px);
  float: left;
  transition: transform 0.5s;
  border-right: solid thin rgba(255, 255, 255, 0.3);
  height: 50%;
}

.wrapper .container .bottom .right .done i {
  font-size: 30px;
  padding: 30px;
  color: white;
}

.wrapper .container .bottom .right .remove {
  width: calc(30% - 1px);
  clear: both;
  border-right: solid thin rgba(255, 255, 255, 0.3);
  height: 50%;
  background: #BC3B59;
  transition: transform 0.5s, background 0.5s;
}

.wrapper .container .bottom .right .remove:hover {
  background: #9B2847;
}

.wrapper .container .bottom .right .remove:hover i {
  transform: translateY(5px);
}

.wrapper .container .bottom .right .remove i {
  transition: transform 0.5s;
  font-size: 30px;
  padding: 30px;
  color: white;
}

.wrapper .container .bottom .right:hover .remove,
.wrapper .container .bottom .right:hover .done {
  transform: translateY(-100%);
}

.wrapper .inside {
  z-index: 9;
  background: #92879B;
  width: 140px;
  height: 140px;
  position: absolute;
  top: -70px;
  right: -70px;
  border-radius: 0px 0px 200px 200px;
  transition: all 0.5s, border-radius 2s, top 1s;
  overflow: hidden;
}

.wrapper .inside .icon {
  position: absolute;
  right: 85px;
  top: 85px;
  color: white;
  opacity: 1;
}

.wrapper .inside:hover {
  width: 100%;
  right: 0;
  top: 0;
  border-radius: 0;
  height: 80%;
}

.wrapper .inside:hover .icon {
  opacity: 0;
  right: 15px;
  top: 15px;
}

.wrapper .inside:hover .contents {
  opacity: 1;
  transform: scale(1);
  transform: translateY(0);
}

.wrapper .inside .contents {
  padding: 5%;
  opacity: 0;
  transform: scale(0.5);
  transform: translateY(-200%);
  transition: opacity 0.2s, transform 0.8s;
}

.wrapper .inside .contents table {
  text-align: left;
  width: 100%;
}

.wrapper .inside .contents h1,
.wrapper .inside .contents p,
.wrapper .inside .contents table {
  color: white;
}

.wrapper .inside .contents p {
  font-size: 13px;
}

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Обработка события в элементах с одинаковым классом</title>
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link rel="stylesheet" href="./style.css">

</head>

<body>
  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 1</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 1</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 2</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 2</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 3</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 3</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

</body>

</html>

Maxim · Answer 2 · 2023-07-11T15:00:28Z

Maxim

2023-07-11T15:00:28Z2023-07-11T15:00:28Z

尝试使用stopPropagation- 阻止事件传递到父元素。 https://api.jquery.com/event.stoppropagation/

<div class="block">
  <div class="block1"></div>
  <div class="block2"></div>
</div>
<div class="block">
  <div class="block1"></div>
  <div class="block2"></div>
</div>
<div class="block">
  <div class="block1"></div>
  <div class="block2"></div>
</div>

<script>
  $('.block1').click(function(event) {
    event.stopPropagation();
    $('.block').addClass("block-clicked");
  });

  $('.block2').click(function(event) {

    $('.block').removeClass("block-clicked");
  });
</script>

2

Denis I · Answer 3 · 2023-07-11T15:46:22Z

Denis I

2023-07-11T15:46:22Z2023-07-11T15:46:22Z

$('.block1').click(function() {
  $(this).parent('.block').addClass("block-clicked");
});

$('.block2').click(function() {
  $(this).parent('.block').addClass("block-clicked");
});

2

ksa · Answer 4 · 2023-07-11T15:19:30Z

必须仅针对一个（其）父块元素处理单击

我会给你一个解决方案...

它的本质是跟踪父元素的点击，然后执行与它们相关的所有操作。

$('.wrapper').click(function(e) {
  const ob = $(this).find('.bottom')
  const o = $(e.target).parent('.buy, .remove')
  if (o.hasClass('buy')) ob.addClass("clicked")
  if (o.hasClass('remove')) ob.removeClass("clicked")
});

html,
body {
  background: #E3E3D8;
  font-family: sans-serif;
  padding: 25px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

.wrapper {
  width: 300px;
  height: 500px;
  background: white;
  margin: auto;
  position: relative;
  overflow: hidden;
  border-radius: 10px 10px 10px 10px;
  box-shadow: 0;
  transform: scale(0.95);
  transition: box-shadow 0.5s, transform 0.5s;
}

.wrapper:hover {
  transform: scale(1);
  box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}

.wrapper .container {
  width: 100%;
  height: 100%;
}

.wrapper .container .top {
  height: 80%;
  width: 100%;
  background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
  -webkit-background-size: 100%;
  -moz-background-size: 100%;
  -o-background-size: 100%;
  background-size: 100%;
}

.wrapper .container .bottom {
  width: 200%;
  height: 20%;
  transition: transform 0.5s;
}

.wrapper .container .bottom.clicked {
  transform: translateX(-50%);
}

.wrapper .container .bottom h1 {
  margin: 0;
  padding: 0;
}

.wrapper .container .bottom p {
  margin: 0;
  padding: 0;
}

.wrapper .container .bottom .left {
  height: 100%;
  width: 50%;
  background: #f4f4f4;
  position: relative;
  float: left;
}

.wrapper .container .bottom .left .details {
  padding: 20px;
  float: left;
  width: calc(70% - 40px);
}

.wrapper .container .bottom .left .buy {
  float: right;
  width: calc(30% - 2px);
  height: 100%;
  background: #f1f1f1;
  transition: background 0.5s;
  border-left: solid thin rgba(0, 0, 0, 0.1);
}

.wrapper .container .bottom .left .buy i {
  font-size: 30px;
  padding: 30px;
  color: #254053;
  transition: transform 0.5s;
}

.wrapper .container .bottom .left .buy:hover {
  background: #A6CDDE;
}

.wrapper .container .bottom .left .buy:hover i {
  transform: translateY(5px);
  color: #00394B;
}

.wrapper .container .bottom .right {
  width: 50%;
  background: #A6CDDE;
  color: white;
  float: right;
  height: 200%;
  overflow: hidden;
}

.wrapper .container .bottom .right .details {
  padding: 20px;
  float: right;
  width: calc(70% - 40px);
}

.wrapper .container .bottom .right .done {
  width: calc(30% - 2px);
  float: left;
  transition: transform 0.5s;
  border-right: solid thin rgba(255, 255, 255, 0.3);
  height: 50%;
}

.wrapper .container .bottom .right .done i {
  font-size: 30px;
  padding: 30px;
  color: white;
}

.wrapper .container .bottom .right .remove {
  width: calc(30% - 1px);
  clear: both;
  border-right: solid thin rgba(255, 255, 255, 0.3);
  height: 50%;
  background: #BC3B59;
  transition: transform 0.5s, background 0.5s;
}

.wrapper .container .bottom .right .remove:hover {
  background: #9B2847;
}

.wrapper .container .bottom .right .remove:hover i {
  transform: translateY(5px);
}

.wrapper .container .bottom .right .remove i {
  transition: transform 0.5s;
  font-size: 30px;
  padding: 30px;
  color: white;
}

.wrapper .container .bottom .right:hover .remove,
.wrapper .container .bottom .right:hover .done {
  transform: translateY(-100%);
}

.wrapper .inside {
  z-index: 9;
  background: #92879B;
  width: 140px;
  height: 140px;
  position: absolute;
  top: -70px;
  right: -70px;
  border-radius: 0px 0px 200px 200px;
  transition: all 0.5s, border-radius 2s, top 1s;
  overflow: hidden;
}

.wrapper .inside .icon {
  position: absolute;
  right: 85px;
  top: 85px;
  color: white;
  opacity: 1;
}

.wrapper .inside:hover {
  width: 100%;
  right: 0;
  top: 0;
  border-radius: 0;
  height: 80%;
}

.wrapper .inside:hover .icon {
  opacity: 0;
  right: 15px;
  top: 15px;
}

.wrapper .inside:hover .contents {
  opacity: 1;
  transform: scale(1);
  transform: translateY(0);
}

.wrapper .inside .contents {
  padding: 5%;
  opacity: 0;
  transform: scale(0.5);
  transform: translateY(-200%);
  transition: opacity 0.2s, transform 0.8s;
}

.wrapper .inside .contents table {
  text-align: left;
  width: 100%;
}

.wrapper .inside .contents h1,
.wrapper .inside .contents p,
.wrapper .inside .contents table {
  color: white;
}

.wrapper .inside .contents p {
  font-size: 13px;
}

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Обработка события в элементах с одинаковым классом</title>
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link rel="stylesheet" href="./style.css">

</head>

<body>
  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 1</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 1</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 2</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 2</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <div class="wrapper">
    <div class="container">
      <div class="top"></div>
      <div class="bottom">
        <div class="left">
          <div class="details">
            <h1>Номер 3</h1>
          </div>
          <div class="buy"><i class="material-icons">add_shopping_cart</i></div>
        </div>
        <div class="right">
          <div class="done"><i class="material-icons">done</i></div>
          <div class="details">
            <h1>Номер 3</h1>
          </div>
          <div class="remove"><i class="material-icons">clear</i></div>
        </div>
      </div>
    </div>
    <div class="inside">
      <div class="icon"><i class="material-icons">info_outline</i></div>
      <div class="contents">
        Описание
      </div>
    </div>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

</body>

</html>

jQuery、js。对具有相同类的元素进行单独的事件处理？

我看不懂措辞

请求的模块“del”不提供名为“default”的导出

"!+tab" 在 HTML 的 vs 代码中不起作用

我正在尝试解决“猜词”的问题。Python

可以使用哪些命令将当前指针移动到指定的提交而不更改工作目录中的文件？

Python解析野莓

问题：“警告：检查最新版本的 pip 时出错。”

帮助编写一个用值填充变量的循环。解决这个问题

尽管依赖数组为空，但在渲染上调用了 2 次 useEffect

数据不通过 Telegram.WebApp.sendData 发送

jQuery、js。对具有相同类的元素进行单独的事件处理？

4 个回答

相关问题