jQuery 复选框库选择答案

【问题标题】：jQuery checkbox gallery selectjQuery 复选框库选择
【发布时间】：2020-11-05 01:16:16
【问题描述】：

如何为以下内容创建 JQuery 函数？

当我检查图像时，我想单击按钮并将该图像复制到另一个以处理所选图像。

这是我制作的示例，但效果不佳：

            $(document).ready(function () {
                $('input[name="obrazky"]').click(function () {
                    getSelectedCheckBoxes('obrazky');
                });

                var getSelectedCheckBoxes = function () {
                    var result = $('input[name="obrazky"]:checked');
                    if (result.length > 0) {
                        var resultString = result.length + " checkbox checked<br/>";
                        result.each(function () {
                            var selectedValue = $(this).val();
                            resultString += selectedValue + " - "
                                + $('label[class="obrazek' + selectedValue + '"]').html() + "<br>";
                        });
                        $('#showselected').html(resultString);
                    }
                    else {
                        $('#showselectedk').html("No checkbox checked");
                    }
                };
            });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label class="obrazek1"><input type="checkbox" name="obrazky" class="filled-in" value="1"><span></span><img alt="" height="100" width="100" src="https://tvorbawebu.net/eshopserver/uploads/Pentair-Led-Pool-Lights.jpg"></label>   
       <label class="obrazek2"><input type="checkbox" name="obrazky" class="filled-in" value="2"><span></span><img alt="" height="100" width="100" src="https://tvorbawebu.net/eshopserver/uploads/f823888da14805caf9a229986595f06c.jpg"></label>
       <label class="obrazek3"><input type="checkbox" name="obrazky" class="filled-in" value="3"><span></span><img alt="" height="100" width="100" src="https://tvorbawebu.net/eshopserver/uploads/Downunda-perimeter-overflow-pool-raised-spa-fire-bowls_490.jpg"></label>
       

        <div id="showselected"></div>

我想制作像 Wordpress 一样的文件库，您可以在其中选择文件并放入主帖子缩略图。

感谢您的帮助。

【问题讨论】：

先生，您能解释一下当您选择这些图像时您接下来要做什么吗？您的描述中没有说明清楚。你也可以在jsfiddle中创建这个例子吗？
嗨，这里是代码：jsfiddle.net/6j4dwouq 我想在没有任何代码和输入的情况下“复制”和“粘贴”该图像...
这是你想要的jsfiddle.net/tnLymacq 吗？
是的！而已！ :) 非常感谢你，你真的帮助了我。
我应该添加它作为您接受它的答案吗？

标签： jquery select checkbox gallery

【解决方案1】：

JS：

    $(document).ready(function () {
        $('input[name="obrazky"]').click(function () {
            getSelectedCheckBoxes('obrazky');
        });

        var getSelectedCheckBoxes = function () {
            var result = $('input[name="obrazky"]:checked');
            if (result.length > 0) {
                var resultString = result.length + " checkbox checked<br/>";
                result.each(function () {
                    var selectedValue = $(this).val(),
                        $lbl = $('label[class="obrazek' + selectedValue +'"] img');
                    resultString += selectedValue + " - " + $lbl.clone().wrap('<div/>').parent().html() + "<br>";
                        
                });
                $('#showselected').html(resultString);
            }
            else {
                $('#showselected').html("No checkbox checked");
            }
        };
    });

工作小提琴： https://jsfiddle.net/tnLymacq/

【讨论】：