检查按钮上的单选按钮，在标签内单击

Question

单击标签检查单选按钮，但不单击该标签内的按钮

检查例子

小提琴

<input id="349" type="radio" value="1" name="question1">
<label for="349"><button type="button">  Abe   </button></label>
<br>
<input id="350" type="radio" value="2" name="question1">
<label for="350">Andrew</label>

Answer 1

只需一点jQuery，您就可以做到这一点。

$('form').on('click', 'button', function() {
  $(this).closest('label').prev('input').attr('checked', 'checked');
});

参见： http : //jsfiddle.net/56c1zd6b/

Answer 2

您应该在按钮上添加一个id，例如：

<button id="btn_349" type="button">
    Abe
</button>

然后玩一些jQuery：

$("#btn_349").on("click", function(){
    $("#349").prop("checked", true);
});

或如果出于某种原因想要纯js，请使用以下代码：

var btn = document.getElementById("btn_349");
btn.addEventListener("click", function(){
    document.getElementById("349").checked = true;
}, false);

Answer 3

您可以通过检查哪个单选按钮来获取值，也可以通过检查for属性值来获取标签的值

<button type="button" onclick="GetName()">Abe</button>
function GetName()
{

  var value = $("input[name='question1']:checked").val();
  var name = $('label[for=' + $("input[name='question1']:checked").attr("id") + ']').text();
}

Answer 4

您可以将onclick事件添加到相关按钮，并将其链接到输入单选标签。

function abe() {
  $('#349').trigger('click');
}

这是一个样本小提琴： http : //jsfiddle.net/r2masf5t/