Question

我输入了无线电元素作为超链接的子节点，如下所示：

<li ><a href="/ar/news/source/?source=2"><input type="radio" class="searchSrc" name="searchSrc" value="2"  style="display: inline" />&nbsp;الشروق</a></li>

<li ><a href="/ar/news/source/?source=3"><input type="radio" class="searchSrc" name="searchSrc" value="3"  style="display: inline" />&nbsp;الجزيرة</a></li>

<li ><a href="/ar/news/source/?source=4"><input type="radio" class="searchSrc" name="searchSrc" value="4"  style="display: inline" />&nbsp;شبكة رصد</a></li>

我想仅针对输入的父超链接阻止默认，同时保持更改无线电值的可访问性，即单击它们。

我尝试了以下内容：

$(".searchSrc").parent().click(function(event){
      event.preventDefault();
      $(this).children('.searchSrc').attr('checked', this.checked);
      //also I tried to place event.preventDefault(); in this line
    })

但是，我只能在收音机上点击一次按钮，我就无法再次更改已检查的收音机。

Answer 1

<a>标记没有checked属性。您的this是<a>元素。

要修复您尝试执行的操作，请使用prop()并将其与函数回调一起使用，如下所示：

$(".searchSrc").parent().click(function (event) {
    event.preventDefault();
    $(this).children('.searchSrc').prop('checked', function () {
        return !this.checked
    });

});

直接从收音机本身工作就可以了：

$(".searchSrc").click(function (event) {
      event.stopPropagation();
});

我不能说我理解你为什么要在<a>标签内放置无线电......对我来说似乎很奇怪。

的 DEMO

Answer 2

您在设置中尝试实现的目标并不是很清楚，但如果您不希望输入周围的锚点链接可以点击，那么您应该完全删除它们并摆脱javascript。鉴于您的尝试，它们不起任何作用。单选按钮也可以在该点正确选择。

Answer 3

点击监听器应位于.searchSrc元素上，您应使用stopPropagation代替preventDefault

仅为父链接的Jquery preventDefault

3 个答案: