0

由于用户对另一个无线电组的操作,如何使用 Jquery 将默认值分配给另一个脚本未选中的无线电组?

页面上只有一个图像可以分配值“主要”或“次要”。但底部的两个值(“keep”或“delete”)不是独占的,可以应用于页面上的任何图像。该列由正常的单选按钮组行为控制。

通过 jQuery 有 2-way 排他性。(http://css-tricks.com/radio-buttons-with-2-way-exclusivity/

<div class="dlab-image-blocks text-center"><img width="150" height="150" src="http://mrtwebdesign.local/ddd/wp-content/uploads/2013/02/Desert1-150x150.jpg" class="attachment-thumbnail" alt="Desert">
  <div class="dlab-ctrl btn-group btn-group-vertical padtop20">
    <label class="btn btn-primary">
      <input type="radio" id="primary871" name="col-871 " class="rbtn" data-row="1" value="primary">Primary
    </label>
    <label class="btn">
      <input type="radio" id="secondary871" name="col-871 " data-row="2" class="rbtn" value="secondary">Secondary
    </label>
    <label class="btn keep">
      <input type="radio" id="keep871" name="col-871 " class="rbtn keep" value="keep" checked="checked">Unused, but keep
    </label>
    <label class="btn">
      <input type="radio" id="delete871" name="col-871 " class="rbtn" value="delete">Delete image
    </label>
  </div> <!-- dlab-ctrl btn-group btn-group-vertical padtop20 -->
</div>

我要分配的默认值是用于值为“keep”的输入。我有几种不同的选择方式。但页面上任何会触发脚本的操作都将在另一个无线电组中。

<script>
    $('label').click(function() {
        if ($('input:radio[name|="col"]').length == 0){
           $(this).filter(".keep").attr('checked',true);
        }
    });
</script>

我认为这仅适用于单击的单选按钮组。但点击将始终在另一个组上。

+++++++++++++++++++++++++++++++++++++++++++更新。JSFIDDLE 中的示例:http: //jsfiddle.net/mrtwebdesign/fQUX3/

+++++++++++++++++++++++++++++++++++++++++++我最近的尝试。我试图调整页面上的其他工作脚本。仍然不确定我在做什么。

我更新了上面的 jsfiddle 链接

setTimeout(function() {
    var attached, elm;
    $("input[type=radio]").click(function () {
        elm = $(this);
        attached = elm.data("attached");
        if ($("input[data-attached=" + attached + "]").length == 0){
        elm.filter('.keep').prop("checked", true);
        }
    });
},500);
4

1 回答 1

0

经过几个小时的实验,我终于弄明白了。

我已将 jsfiddle 重新设置为工作版本。 http://jsfiddle.net/mrtwebdesign/fQUX3/

所以..我能够将它整合到一个脚本中。它在匹配值上设置了 'data-row=' 的单选按钮集强制执行双向排他性。如果一个组最终不受检查。将选中该组中具有“保留”类的单选按钮(即默认值)

var row, el, groupName;

$("input[type=radio]").click(function() {
    el = $(this);
    row = el.data("row");
    $("input[data-row=" + row + "]").prop("checked", false);
    el.prop("checked", true);
    groupName = $(this).attr("name");
    $(".rbtn").each(function(idx)
     {
         if($(this).attr("name") != groupName)
         {
         $(this).filter(".keep").prop("checked", true);
         }
     });
});
于 2013-03-19T09:40:33.307 回答