javascript - 在选中的复选框上方查找隐藏字段值

Question

我正在尝试返回选中复选框上方的隐藏输入字段值。因为目前我正在寻找undefined.

这是我尝试过的。

var checkedTopics = document.getElementsByName("chkRelatedTopics");
for (var i = 0; i < checkedTopics.length; i++) {
    if (checkedTopics[i].checked) {
        var uniqueKeyTopic = $(this).parent().
                       find("input[name=hidTopicsDomain]").val();
        console.log(uniqueKeyTopic);
    }

}

这是标记

{{each Items}}
                <tr>

                    <td>
                        <input type='hidden' 
                              name='hidTopicsDomain' value='${DomainObjectKey}'/>
                        <input type='checkbox' 
                                     name='chkRelatedTopics' value='${subject}'/>
                    </td>
                    <td><label id='labRelatedTopicDisplay'>${subject}</label>
                </tr>

            {{/each}}

如何检索这个隐藏的input field值？

谢谢

Answer 1

您不能在 for 循环中使用它，使用 .each() 并使用兄弟姐妹来查找输入

var checkedTopics = document.getElementsByName("chkRelatedTopics");
$(checkedTopics).each(function(){
    if (this.checked) {
        var uniqueKeyTopic = $(this).siblings("input[name=hidTopicsDomain]").val();
        console.log(uniqueKeyTopic);
    }
});

Answer 2

尝试这个：

$('input[type=checkbox]:checked').each(function(){
$(this).prev('input[name=hidTopicsDomain]').val();
});

或者，如果您想控制选中和未选中，请使用以下命令：

 $('input[type=checkbox]').each(function(){
   if($(this).is(':checked')){
   //perform something if checked
   }
   else{
   //perform something if not checked.
   }
    });

Answer 3

检查下面是否有帮助。

http://jsfiddle.net/sandeep605085/28peQ/2/

html:
<table>
<tr>
    <td>
        <input type='hidden' name='hidTopicsDomain' value='HiddenFieldValue1'/>
        <input type='checkbox' checked name='chkRelatedTopics' value='checkbox1'/>
    </td>
    <td>
        <label id='labRelatedTopicDisplay'>label1</label>
    </td>
</tr>
<tr>
    <td>
        <input type='hidden' name='hidTopicsDomain' value='HiddenFieldValue2' />
        <input type='checkbox' checked name='chkRelatedTopics' value='checkbox2'/>
    </td>
    <td>
        <label id='labRelatedTopicDisplay'>label2</label>
    </td>
</tr>
<tr>
    <td>
        <input type='hidden' name='hidTopicsDomain' value='HiddenFieldValue3'/>
        <input type='checkbox' name='chkRelatedTopics' value='checkbox3' />
    </td>
    <td>
        <label id='labRelatedTopicDisplay'>label3</label>
    </td>
</tr>
<tr>
    <td>
        <input type='button' id='buttonclick' value='Click to Test' />
        </td>
    </tr>
    </table>


js:

$('#buttonclick').click(function(){
    var checkedTopics = $('input[name="chkRelatedTopics"]');

    checkedTopics.each(function(){

        if ($(this).is(':checked')) {
            var uniqueKeyTopic = $(this).prev().val();
            alert(uniqueKeyTopic);
        }
    });
});

谢谢。