Question

我有一个以复选框形式的标签列表

点击按钮如何获取未选中的所有标签？

例如，从下面的HTML如何获取标签NBCC（未选中）

<div class="portlet light bordered recognizer" id="portlet4" data-videoid="4">
   <div class="portlet-title">
      <div class="caption">
         <span class="caption-subject font-green sbold uppercase"></span>
      </div>
      <div class="actions"><a href="#" class="btn btn-sm btn-danger deletevideovideolist"><i class="icon-pencil"></i> Delete</a>
      </div>
   </div>
   <div class="portlet-body" style="padding-top:0px;">
      <div class="tags-body videolist-tags-body">
         <table class="table" id="tagstable">
            <tbody>
               <tr>
                  <td><label class="mt-checkbox mt-checkbox-outline"><input type="checkbox" id="tagid5">NBCC tag <span></span></label></td>
                  <td><label class="mt-checkbox mt-checkbox-outline"><input type="checkbox" id="tagid2" checked>STAR tag <span></span></label></td>
               </tr>
            </tbody>
         </table>
      </div>
      <div class="timerContainer">
         <table class="table">
            <tbody>
               <tr>
                  <th width="14%"></th>
                  <th width="28.6%" align="left">A</th>
                  <th width="28.6%" align="left">B</th>
                  <th width="28.6%" align="left">C</th>
               </tr>
               <tr>
                  <td style="padding:0px;">D</td>
                  <td><input type="number" min="0" id="video_4timerBasic" max="59" maxlength="2" name="timer" data-required="1" value="100" class="form-control"></td>
                  <td><input type="number" min="0" id="video_4timerIntermedaite" max="59" maxlength="2" name="timer" data-required="1" value="400" class="form-control"></td>
                  <td><input type="number" min="0" id="video_4timerAdvanced" max="59" maxlength="2" name="timer" data-required="1" value="700" class="form-control"></td>
               </tr>
               <tr>
                  <td style="padding:0px;">E</td>
                  <td><input type="number" id="video_4repsBasic" min="0" max="59" maxlength="2" name="reps" data-required="1" value="200" class="form-control"></td>
                  <td><input type="number" id="video_4repsIntermedaite" min="0" max="59" maxlength="2" name="reps" data-required="1" value="500" class="form-control"></td>
                  <td><input type="number" id="video_4repsAdvanced" min="0" max="59" maxlength="2" name="reps" data-required="1" value="800" class="form-control"></td>
               </tr>
               <tr>
                  <td style="padding:0px;">F</td>
                  <td><input type="number" id="video_4pointsBasic" min="0" max="59" maxlength="2" name="points Name" data-required="1" value="300" class="form-control"></td>
                  <td><input type="number" id="video_4pointsIntermedaite" min="0" max="59" maxlength="2" name="points Name" data-required="1" value="600" class="form-control"></td>
                  <td><input type="number" id="video_4pointsAdvanced" min="0" max="59" maxlength="2" name="points Name" data-required="1" value="900" class="form-control"></td>
               </tr>
            </tbody>
         </table>
         <br>
         <button type="submit" class="btn btn-success uploadvideodetails" style="margin-left:92px;">Get All Unchecked Tags</button>
      </div>
   </div>
</div>

我试过

var tag_ids = [];

$(document).on("click", ".uploadvideodetails", function(event) {

    $("#portlet4").each(function() {
        $('#tagstable').find('label:has(input[type="checkbox"]:checked)').each(function() {
            tag_ids.push($(this).attr("id"));
        });

    });
    console.log(tag_ids)
});

http://jsfiddle.net/cod7ceho/206/

Answer 1

您可以使用:not(:checked)定位未选中的复选框，然后映射ID

$(document).on("click", ".uploadvideodetails", function(event) {
    var tag_ids = $("#portlet4 input[type='checkbox']:not(:checked)").map(function() {
        return this.id;
    });
    console.log(tag_ids)
});

FIDDLE

如何获取数组中的所有未经检查的标记

1 个答案: