问题描述
我需要将.selectedIcon的img克隆到单击的.icon中，然后如果单击另一个.icon，则仅需要编辑所选的.icon。 我的解决方案会编辑所有单击的.icon。 .click（）是否有其他解决方案？
$(".icon").on("click", function() { let thisIcon = $(this); alert("icon clicked"); $(".icons").fadeIn("slow"); function imagePicker() { $(".iconSelect").on("click", function() { $(".selectedIcon").html(""); $(this).clone().appendTo(".selectedIcon"); $(thisIcon).html(""); $(".selectedIcon img").clone().appendTo(thisIcon); }) } imagePicker(); })
.icons { display: none; )
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="panels"> <div class="first hidden"> <table> <tr> <td> <div class="icon 20iconA">A</div> </td> </tr> <tr> <td> <div class="icon 20iconB">B</div> </td> </tr> </table> </div> </div> <!--image picker --> <div class="iconEditWrap"> <div class="iconEdit"> <div class="selectedIcon"> </div> <div class="icons"> <img class="iconSelect" alt="img1"> <img class="iconSelect" alt="img2"> </div> </div> </div>
1楼
mrdeadsven
2
已采纳
2019-02-12 12:52:03
我认为这是您要完成的工作？ 您可以在点击内使用功能，该功能还将在您的旧选择上添加下一次点击事件。
let thisIcon; $(".icon").on("click", function() { thisIcon = $(this); alert("icon clicked"); $(".icons").fadeIn("slow"); //imagePicker(); }) //function imagePicker() { $(".iconSelect").on("click", function() { $(".selectedIcon").html(""); $(this).clone().appendTo(".selectedIcon"); $(thisIcon).html(""); $(".selectedIcon img").clone().appendTo(thisIcon); }) //}
.icons { display: none; )
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="panels"> <div class="first hidden"> <table> <tr> <td> <div class="icon 20iconA">A</div> </td> </tr> <tr> <td> <div class="icon 20iconB">B</div> </td> </tr> </table> </div> </div> <!--image picker --> <div class="iconEditWrap"> <div class="iconEdit"> <div class="selectedIcon"> </div> <div class="icons"> <img class="iconSelect" alt="img1"> <img class="iconSelect" alt="img2"> </div> </div> </div>