从选中的复选框中获取文本

时间:2018-05-29 17:51:39

标签: javascript jquery html

我在一堆元素中有一组复选框:

git+ssh://git@github.com/my_comp/my_repo.git#egg=MyRepo

我使用以下JavaScript代码尝试获取已检查项目的文本,但它似乎无法正常工作。我不确定我错过了什么,一些帮助将不胜感激

<label class="control-label">Items</label>
<div class="controls">
    <div id="13" class="checkboxes columns-container columns-count-two">
        <div class="column-item">
            <label class="checkbox">
                <input name="13[]" value="Item 1" type="checkbox">Item 1
            </label>
        </div>
        <div class="column-item">
            <label class="checkbox">
                <input name="13[]" value="Item 2" type="checkbox">Item 2
            </label>
        </div>
        <div class="column-item">
            <label class="checkbox">
                <input name="13[]" value="Item 3" type="checkbox">Item 3
            </label>
        </div>
    </div>
</div>

1 个答案:

答案 0 :(得分:1)

您的选择器实际上有正确的标签。问题是你是如何尝试获取label文本的。

您的选择器会为您提供已选中的<input> 使用.parent()您可以通过<label>获取.text() 然后使用.trim()获取标签文本。 最后使用$(this).parent().text().trim(); 删除文本末尾的多余空格。

function checkChecked(){
  var checktext = $('#13 input:checkbox:checked').map(function() {
    return $(this).parent().text().trim();
  }).get();
  console.log(checktext)
}

希望这会有所帮助:)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="control-label">Items</label>
<div class="controls">
  <div id="13" class="checkboxes columns-container columns-count-two">
    <div class="column-item">
      <label class="checkbox">
                <input name="13[]" value="Item 1" type="checkbox">Item 1
            </label>
    </div>
    <div class="column-item">
      <label class="checkbox">
                <input name="13[]" value="Item 2" type="checkbox">Item 2
            </label>
    </div>
    <div class="column-item">
      <label class="checkbox">
                <input name="13[]" value="Item 3" type="checkbox">Item 3
            </label>
    </div>
  </div>
</div>

<button onclick='checkChecked()'>Check checked</button>
GET