Question

我有一个类似的代码：

<div class="answer_id" value="1" name="false">
  <input id="AsnwerAnswer1" type="checkbox" value="1" name="true"></input>
  Answer 1
</div>

我有4个答案，就像上面的代码一样，唯一改变的是我的div和输入ID中的值。

当我点击复选框时，所选复选框的值为true：

$("input:checkbox").click(function() {
     var thisChecked = $(this)[0].checked;
        $("input:checkbox").removeAttr('checked');
        $("input:checkbox").attr('name', 'false');
        $(this).attr('name', 'true');
        $(this)[0].checked = thisChecked ? true : false;
 });

当我点击按钮发送答案时：

$('#sendReponse').click(function(){

我想获取包含所选复选框的div的值（值为true的那个）。

我应该添加什么：

var iReponseId = $(this).closest('.answer_id').attr('value');

顺便说一句，如果你能帮助我理解点击功能的作用，真的很棒。据我说，这删除了所有检查的atrributes所以我只能选中一个复选框，这将每个复选框的名称设置为false，期望选择的那个，但我不明白这一点：

 $(this)[0].checked = thisChecked ? true : false;

编辑：

我这样做是为了得到我想要的东西：

    $("input:checkbox").click(function() {
        $("input:checkbox").not(this).prop('checked',false).removeAttr('class', 'chosen_answer');
        $(this).attr('class', 'chosen_answer');
    });

然后

 $('#sendReponse').click(function(){
 var iReponseId = $('.chosen_answer').closest('.answer_id').attr('value');

Answer 1

在您的代码中$(this)[0].checked = thisChecked ? true : false;有助于在删除checked属性后回滚以前的checked属性状态，它可以缩减为this.checked = thisChecked。

您可以按如下方式减少整个代码

// use change event always for chekbox
$("input:checkbox").change(function() {
    // get all checkbox
    $("input:checkbox")
         .not(this) // ignore the clicked checkbox
         .prop('checked',false) // uncheck the checkbox 
         .attr('name', 'false'); // set the attribute
    $(this).attr('name', 'true'); // set name of clicked 
});

要获取包含输入的div，您需要使用answer_id类而不是response_id。

var iReponseId = $(this).closest('.answer_id').attr('value');

仅供参考：使用自定义属性时始终使用标准data-*格式。

使用jquery

1 个答案: