jquery - 如何使用 jQuery 获取复选框标签文本

Question

我已经制作了自己的选择下拉菜单，下拉菜单中有复选框:

---Select----
-option1-
-option2-
-option3-

对于用户只会显示选择，但当用户单击时它会显示选项(就像普通表单的选择)。选项是复选框。现在我想做的是在用户单击它们并将其传递给该“选择”时获取这些复选框的标签。同样最重要的是，如果用户取消选择所有复选框，我如何将文本重置回“选择”？

自定义选择的 JS 就是这样:

$('.custom-select').click(function() {
$(this).children('.custom-select-drop').toggleClass('not-showed');
)};

当用户选中其中一个复选框时，如果该信息有任何帮助，则该复选框会选择类别。

编辑:HTML:

<div class="custom-select">
<span class="selectTitle">Something</span>
<div class="custom-select-drop not-showed">
<label for="check1">
<input type="checkbox" class="ch" id="check1" />Check1
</label>
<label for="check2">
<input type="checkbox" class="ch" id="check2" />Check2
</label>
<label for="check3">
<input type="checkbox" class="ch" id="check3" />Check3
</label>

现在假设用户单击了复选框 ID check2 和 check3。我想获取这些标签文本(Check2 和 Check3)并将其传递到内部 .. 替换 Something 文本。如果用户取消选中复选框，则 selectTitle 文本将更改为默认的 Something。

Answer 1

如果我正确理解任务，这个解决方案可能会有帮助

示例 HTML:

<select id="select_element">
    <option id="default"> - select - </option>
</select>

<div>
    <label><input type="checkbox" class="checkboxes" value="someval1">Box value 1</label><br>
    <label><input type="checkbox" class="checkboxes" value="someval2">Box value 2</label><br>
    <label><input type="checkbox" class="checkboxes" value="someval3">Box value 3</label><br>
    <label><input type="checkbox" class="checkboxes" value="someval4">Box value 4</label><br>
</div>

复选框操作代码:

$(document).ready( function() {
    var default_opt = false;

    $(".checkboxes").change( function() {
        var opt_id = 'opt' + $(this).val();

        if( $(this).is(":checked") ) {

            // Saving default value
            if( !default_opt ) {
                default_opt = $( '#select_element > #default').clone();
                $( '#select_element > #default').remove()
            }

            var text = $(this).parent().text().trim(); ///< Getting trimmed label's text
            var item = $('<option></option>').attr({ id: opt_id, value: text }).text( text ); ///< Creating new <option> element with that text

            $('#select_element').append( item ); ///< Puting this <option> to the <select>
        }
        else {
            $( '#select_element > #' + opt_id ).remove();

            // Restoring default value ( if no checkboxes are selected
            if( ! $( '#select_element' ).children().length ) {
                $( '#select_element' ).append( default_opt );
            }
        }
    });
});